Question

当前代码：我使用了bootstrap-select.min.js and bootstrap-select.min.css。对于下拉样式目的，我使用了class =“selectpicker”。我已经给出了以下代码。无需使用class =“selectpicker”下拉列表即可。

<select  class="form-control selectpicker" multiple="multiple"  id="skill"    [(ngModel)]="skills" name="skill"   #skill="ngModel"> <option *ngFor="let skill of skillType.skills" [value]="skill.skill_id"  >{{skill.skill_descr}}</option> </select>

问题：问题是当我使用class =“selectpicker”下拉列表未显示时。当我检查控制台时，它显示：

<!--bindings={
  "ng-reflect-ng-for-of": "[object Object],[object Object"
}-->

请帮帮我。

Answer 1

我正在使用Prime NG和Angular 4，看到这个答案可以帮到你。

import {MultiSelectModule} from 'primeng/primeng';

使用ngModel定义双向值绑定，而multiselect需要一组选项，其中每个选项应遵循定义标签值属性的SelectItem接口。

<强> HTML

<p-multiSelect [options]="cities" [(ngModel)]="selectedCities"></p-multiSelect>

ANGULAR TYPESCRIPT

import {SelectItem} from 'primeng/primeng';

export class MyModel {

    cities: SelectItem[];

    selectedCities: string[];

    constructor() {
        this.cities = [];
        this.cities.push({label:'New York', value:'New York'});
        this.cities.push({label:'Rome', value:'Rome'});
        this.cities.push({label:'London', value:'London'});
        this.cities.push({label:'Istanbul', value:'Istanbul'});
        this.cities.push({label:'Paris', value:'Paris'});
    }

}

Answer 2

this.cities = [];
    this.cities.push({id:'New York', itemName:'New York'});
    this.cities.push({id:'Rome', itemName:'Rome'});
    this.cities.push({id:'London', itemName:'London'});
    this.cities.push({id:'Istanbul', itemName:'Istanbul'});
    this.cities.push({id:'Paris', itemName:'Paris'});

多选下拉不工作角2

2 个答案: