SelectItem的未处理承诺拒绝

时间:2017-09-27 15:10:46

标签: angular primeng

我的app.module.ts和我的app.welcome-panel-menu-list.component.ts之间出现此错误。有人能指出我的问题是什么吗?

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面板菜单-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>

ERROR:

    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>

1 个答案:

答案 0 :(得分:2)

根据错误消息,您的问题似乎是p-listbox的组件未指定options作为输入。

如果该组件是您编写的内容,我会查看它支持的输入并使用其中一个,或添加实现您的功能的options输入。

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

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