在Angular 2 Webpack应用程序中不能包含PrimeNG

Question

我正在使用ng2-admin template并试图在其中包含PrimeNG，但我很努力地添加它。

下面我在模板中做了包括PrimeNG变化

./src/vendor.browser.ts：

// Prime faces: http://www.primefaces.org/primeng/#/setup 
import 'primeng/primeng'; 

./src/app/app.module.ts：

import { ToggleButtonModule } from 'primeng/primeng'; 

@NgModule({ 
    bootstrap: [App], 
    declarations: [ 
    App 
    ], 
    imports: [ // import Angular's modules 
    ... 
    ... 
    ... 
    ToggleButtonModule 
    ], 
    providers: [ // expose our Services and Providers into Angular's dependency injection 
    ENV_PROVIDERS, 
    APP_PROVIDERS 
    ] 
}) 

./src/app/pages/dashboard/dashboard.component.ts：

import { ToggleButtonModule } from 'primeng/primeng'; 

./src/app/pages/dashboard/dashboard.html：

<p-toggleButton [(ngModel)]="checked"></p-toggleButton> 

我收到以下错误：

Can't bind to 'ngModel' since it isn't a known property of 'p-toggleButton'.

1. If 'p-toggleButton' is an Angular component and it has 'ngModel' input, then verify that it is part of this module.
2. If 'p-toggleButton' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schemas' of this component to suppress this message.

如果我删除ngModel从标签，我得到以下错误：

'p-toggleButton' is not a known element:

1. If 'p-toggleButton' is an Angular component, then verify that it is part of this module.
2. If 'p-toggleButton' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schemas' of this component to suppress this message.

将PrimeNG集成到Angular 2-Webpack应用程序中的正确方法是什么？我在这里错过了什么？

Answer 1

我还没有使用PrimeNG，但正在研究它。

但是，我认为你的问题更容易解决。 ngModel来自Angular FormsModule。他们的文档可以使这种依赖更加清晰。

将此添加到您的NgModule。

import { FormsModule } from '@angular/forms'; 

@NgModule({ 
    imports: [ 
    ... 
    FormsModule 
    ], 
    ... 
});