Nicht in der Lage, PrimeNG in Angular 2 Webpack-App

Question

zu integrieren Ich verwende ng2-admin template und versuche, PrimeNG darin aufzunehmen, aber ich habe Mühe, es hinzuzufügen.

Unten Änderungen, die ich in der Vorlage tat PrimeNG

./src/vendor.browser.ts enthalten:

// 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> 

ich folgende Fehler bekommen:

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.

Wenn ich entfernen ngModel vom Tag bekomme ich folgenden Fehler:

'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.

Wie ist die korrekte Integration von PrimeNG in die Angular 2-Webpack App? Was ich hier vermisse?

Answer 1

Ich habe PrimeNG noch nicht benutzt, aber ich untersuche es.

Allerdings denke ich, dass Ihr Problem einfacher zu lösen ist. ngModel kommt aus dem Angular FormsModule. Ihre Dokumentation könnte diese Abhängigkeit deutlicher machen.

Fügen Sie dies Ihrem NgModule hinzu.

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

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