Non pris en charge Promise rejet pour SelectItem

Question

Je reçois cette erreur entre mon app.module.ts et mon app.welcome-panel-menu-list.component.ts. Quelqu'un peut-il me dire quels sont les problèmes?

app.module.ts:

import { NgModule }  from '@angular/core'; 
import { BrowserModule } from '@angular/platform-browser'; 
import { CommonModule } from '@angular/common'; 
import { AppComponent } from './app.component'; 
import { MenuBar }  from './app.menu-bar.component'; 
import { WelcomePanel } from './app.welcome-panel.component'; 
import { WelcomePanelList } from './app.welcome-panel-menu-list.component'; 
import { MenubarModule } from 'primeng/primeng'; 
import { ButtonModule } from 'primeng/primeng'; 
import { SelectItem } from 'primeng/primeng'; 

@NgModule({ 
    imports:  [ BrowserModule, MenubarModule, ButtonModule, CommonModule ], 
    declarations: [ AppComponent, MenuBar, WelcomePanel, WelcomePanelList ], 
    bootstrap: [ AppComponent ] 
}) 
export class AppModule { } 

app.welcome-panneau-menu-list.component.ts:

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

@Component({ 
    selector: 'welcome-panel-menu-list', 
    templateUrl: './app/app.welcome-panel-menu-list.component.html' 
}) 

export class WelcomePanelList { 
    items: SelectItem[]; 

    selectedItem: string; 

    selectedItems: string[]; 

    constructor() { 
     this.items = []; 
     this.items.push({label:'Observations', value:'Observations'}); 
     this.items.push({label:'Profile', value:'Profile'}); 
    } 

    onNgInit(){ 
     this.constructor(); 
    } 
} 

HTML:

<!-- <h3 class="first">Single</h3> --> 
<p-listbox [options]="items" [(ngModel)]="selectedItem"></p-listbox> 

<p>Selected Item: {{selectedItem}}</p> 

ERREUR:

Unhandled Promise rejection: Template parse errors: 
Can't bind to 'options' since it isn't a known property of 'p-listbox'. 
1. If 'p-listbox' is an Angular component and it has 'options' input, then verify that it is part of this module. 
2. If 'p-listbox' 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. ("<!-- <h3 class="first">Single</h3> --> 

<p-listbox [ERROR ->][options]="items" [(ngModel)]="selectedItem"></p-listbox> 

Answer 1

Basé sur le message d'erreur, votre problème semble être que le composant pour p-listbox ne spécifie pas options comme une entrée.

Si ce composant est quelque chose que vous avez écrit, je regarderais pour voir quelles entrées il supporte et utiliser l'une d'entre elles, ou ajouter une entrée pour options qui implémente votre fonctionnalité.

import { Component, Input } from '@angular/core'; 

@Component() 
export class MyComponent { 
    /* the important thing here is Input */ 
    @Input() options: Array<any> = []; 
}