Polymer Paper-dropdown-menuは、Angular2でngModelとバインドするときに選択して値を取得できません。

Question

ポリマーペーパードロップダウンメニューとペーパーリストボックスを使用しようとしています。今私は拘束力に問題があります。ここで

は、ドロップダウンリストである：

<select name="singleSelect" [ngModel]="(person | async).department"> 
    <option *ngFor="let x of departments"> 
     {{x.name}}</option> 
</select> 

私は私が取得し、セット選択した値ができませんでした紙リストボックスや紙・ドロップダウン・メニュー

<paper-listbox #department 
     ngDefaultControl name="department" 
     [ngModel]="person.department" 
     label="department" > 
    <paper-item *ngFor="let x of departments"> 
     {{ x.name }} 
    </paper-item> 
</paper-listbox> 

departments = [{name: 'HR'}, {name: 'IT'}, {name: 'Admin'}, {name: 'Management'}]; 

に変換します。

助けてください！

Answer 1

は最後に、私は解決策を見つけた：

<paper-dropdown-menu label="Department" #dropdown1>--> 
<paper-listbox #department2 ngDefaultControl name="department2" class="dropdown-content" [ngModel]="(person | async).department" 
    selected="{{(person | async).department}}" attr-for-selected="value"> 
    <paper-item *ngFor="let x of (departments|async)" [value]="x.label"> 
     {{ x.label }} 
    </paper-item> 
</paper-listbox> 

Answer 2

これは私のために働きました。 ngModelをitem.settingという変数に設定しようとしているとします。

私の使用のために、ngForを使用してリストボックスのリストを動的に作成しています。 import { ViewChildren } from '@angular/core';を必ず入力する必要があります。関数setItemSetting()は、リストボックスで選択されているものをitem.settingに設定します。

@ViewChildren('paperListbox') paperListboxes; 
 

 
setItemSetting(index) { 
 
    return this.paperListboxes.toArray()[index].nativeElement.selected; 
 
}

<div *ngFor="let item of items; let i = index;"> 
 
    <paper-dropdown-menu label="Department"> 
 
    <paper-listbox 
 
     ngDefaultControl 
 
     #paperListbox 
 
     class="dropdown-content" 
 
     (click)="item.setting = setItemSetting(i);"> 
 
     <paper-item value="0">Item 1</paper-item> 
 
     <paper-item value="1">Item 2</paper-item> 
 
    </paper-listbox> 
 
    </paper-dropdown-menu> 
 
</div>

あなたが唯一のリストボックスが必要な場合、あなたはこのような何かを行うことができます。この例では、import { ViewChild } from '@angular/core';を含める必要があります。

@ViewChild('paperListbox') paperListbox; 
 

 
setItemSetting() { 
 
    return this.paperListbox.nativeElement.selected; 
 
}

<paper-dropdown-menu label="Department"> 
 
    <paper-listbox 
 
     ngDefaultControl 
 
     #paperListbox 
 
     class="dropdown-content" 
 
     (click)="item.setting = setItemSetting();"> 
 
     <paper-item value="0">Item 1</paper-item> 
 
     <paper-item value="1">Item 2</paper-item> 
 
    </paper-listbox> 
 
    </paper-dropdown-menu>