Angular-CLI 导入 primeng

Question

我正在尝试让 primeng 在我的 angular2 项目中工作，但尚未开始工作。

采取的步骤：

已安装：npm install primeng --save
添加到模块 import {DialogModule} from 'primeng/primeng'; @NgModule({... imports: [DialogModule, ...]});
已将样式表添加到 index.html
添加到模板： <p-dialog header="Test" [(visible)]="display"> Content </p-dialog> 注： display: boolean = false 组件

我没有得到任何构建或运行时间错误，当我单击设置 display = true 的按钮时没有任何反应。

在我的研究中，我看到了很多对 webpack 和 system.js 的引用，我必须映射它。我找不到那些文件，所以我不确定它是否适用于我。

编辑： angular-cli@1.0.0-beta.19-3

Answer 1

您还必须将它添加到导出中（以使其对组件可见）：

@NgModule({
  imports: [ DialogModule],
  exports: [ DialogModule ]
})

Answer 2

采取的步骤可能对您有所帮助，

将所有 css primeng 文件从 index.html 转移到 angular-cli.json 文件。像这样

"styles": [
    "../node_modules/font-awesome/css/font-awesome.css",
    "../node_modules/primeui/primeui-ng-all.min.css"
     ....
  ],

.....

在 html 中打印您的变量 display 以确保绑定，并尝试简单地将模态默认设置为 true，就像这样
```
 <p-dialog header="Test" [(visible)]="true">....
```

Answer 3

您只需要导入您要使用的模块即可。

您的 cli.json 应如下所示。顺便说一下，这只是一个例子。

"styles": [
    "../node_modules/font-awesome/css/font-awesome.min.css",
    "../node_modules/primeng/resources/themes/omega/theme.css",
    "assets/layout/css/layout.css",
    "../node_modules/primeng/resources/primeng.min.css",
    "../node_modules/fullcalendar/dist/fullcalendar.min.css",
    "../node_modules/quill/dist/quill.snow.css",
    "../node_modules/nanoscroller/bin/css/nanoscroller.css",
    "../node_modules/animate.css/animate.css",
    "styles.css"
  ],
  "scripts": [
    "../node_modules/jquery/dist/jquery.js",
    "../node_modules/chart.js/dist/Chart.js",
    "../node_modules/moment/moment.js",
    "../node_modules/fullcalendar/dist/fullcalendar.js",
    "../node_modules/quill/dist/quill.js",
  ],

Angular-CLI 导入 primeng

Angular-CLI import primeng

angular

import

primeng