it-swarm-eu.dev

błąd tego rozwijanego primenga („p-dropdown” nie jest znanym elementem)

Podążając za przewodnikiem: https://www.primefaces.org/primeng/ Próbowałem zainstalować PrimeNG do użycia z Angular4, wykonując kroki opisane powyżej, ale pojawia się błąd:

'p-dropdown' is not a known element:

Próbowałem odbudować projekty, jak sugerowano w innych postach, ale nie działało to dla mnie. Jakieś wskazówki?

Oto wszystkie szczegóły:

- Instalacja PrimeNg

npm install primeng --save

- plik: testdropdown.component.html

<p-dropdown [options]="cities" [(ngModel)]="selectedCity"></p-dropdown>

- plik: testdropdown.component.ts

import { DropdownModule } from 'primeng/primeng';
import { Component, OnInit } from '@angular/core';
import { SelectItem } from 'primeng/primeng';

@Component({
  selector: 'app-testdropdown',
  templateUrl: './testdropdown.component.html',
  styleUrls: ['./testdropdown.component.css']
})
export class TestdropdownComponent implements OnInit {

  cities: SelectItem[];

  selectedCity: string;

  constructor() {

  this.cities = [];
    this.cities.Push({ label: 'Select City', value: null });
    this.cities.Push({ label: 'New York', value: { id: 1, name: 'New York', code: 'NY' } });
    this.cities.Push({ label: 'Rome', value: { id: 2, name: 'Rome', code: 'RM' } });
  }

  ngOnInit() {
  }

}

- błąd:

VM1128:185 [CodeLive] HTTP detected: Connecting using WS
zone.js:630 Unhandled Promise rejection: Template parse errors:
Can't bind to 'options' since it isn't a known property of 'p-dropdown'.
1. If 'p-dropdown' is an Angular component and it has 'options' input, then verify that it is part of this module.
2. If 'p-dropdown' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.
3. To allow any property add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component. ("<p-dropdown [ERROR ->][options]="cities" [(ngModel)]="selectedCity"></p-dropdown>
"): ng:///AppModule/[email protected]:12
'p-dropdown' is not a known element:
1. If 'p-dropdown' is an Angular component, then verify that it is part of this module.
2. If 'p-dropdown' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message. ("[ERROR ->]<p-dropdown [options]="cities" [(ngModel)]="selectedCity"></p-dropdown>
5
Luigi Rubino

Zaimportuj rozwijany moduł w module, w którym deklarujesz swój komponent.

import {DropdownModule} from 'primeng/primeng';

@NgModule({
  imports: [
   DropdownModule
  ],
  declarations: [TestdropdownComponent ]

})
export class myModule { }
11
Eduardo Vargas

Jeśli ten problem będzie się powtarzał, może być konieczne przetestowanie jeszcze jednej rzeczy, tzn. Jeśli „FormsModule” zostanie zaimportowany, jeśli nie, importuj go i spróbuj 

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

@NgModule({
  imports: [
    DropdownModule,
    FormsModule
  ],

Powinno to rozwiązać problem. 

3
Karthik H

Musisz dodać DropdownModule w sekcji imports modułu aplikacji lub modułu, w którym TestdropdownComponent jest zadeklarowany.

1
harilalkm
Root module file like: app.module.ts. Added something like that. 

import {DropdownModule, AccordionModule, SharedModule, ButtonModule,. MessageModule, CalendarModule} z 'primeng/primeng';

@NgModule({
  imports: [
   DropdownModule,
   BrowserModule,
   BrowserAnimationsModule,
   FormsModule,
   AccordionModule,
   PanelModule,
   ButtonModule,
   RadioButtonModule,
   TableModule,
   HttpClientModule,
   ReactiveFormsModule,
   SharedModule,
   MessagesModule,
   KeyFilterModule,
   FieldsetModule,
   CalendarModule,
   MessageModule
  ],
  declarations: [TestdropdownComponent ]

})
export class myModule { }
1
Bipon Biswas