angular2選擇值對象

Question

它變得非常煩人！我有一個對象的數組，我發現這個解決方案：How to use select/option/NgFor on an array of objects in Angular2

但畢竟我這樣做，但如果我登錄我的$事件它是未定義的..可能是因爲它被字符串化，但之後，沒有解析回來。

這裏是我的代碼示例：

<div class="container"> 
<div class="row" *ngFor="#condition of conditions;#conditionindex = index"> 
    <div class="col-xs-3"> 
     <select class="form-control" [ngModel]="stringify(condition)" (ngModelChange)="onChange(conditionindex, $event)"> 
      <option *ngFor="#c of catalog;#catalogindex = index" [value]="stringify(c)"> 
       {{c.name}} 
      </option> 
     </select> 
    </div> 
    <condition-detail [condition]="condition"></condition-detail> 
</div> 

<a class="btn btn-primary" (click)="newCondition()"><i class="glyphicon glyphicon-plus"></i></a> 

這是組件代碼：

export class ConditionBuilderComponent implements OnInit { 
conditions: Condition[] = []; 
catalog: Condition[] = []; 

constructor(public _conditionService: ConditionService) { } 

getConditions() { 
    this._conditionService.getConditions().then(conditions => this.catalog = conditions); 
} 

ngOnInit() { 
    this.getConditions(); 
} 

stringify(o:any): string { 
    return JSON.stringify(o); 
} 

onChange(conditionsIndex, selectedCondition:string): void { 
    console.log(typeof selectedCondition); 
    //JSON.parse(selectedCondition); 
    console.log(selectedCondition); 
    //this.conditions[conditionsIndex] = this.catalog[condition]; 
    console.log(typeof selectedCondition); 
} 

請幫助我。 selectedCondition的控制檯日誌未定義。

Answer 1

明白了媒體鏈接:)

這裏的解決方案：

<select class="form-control" [ngModel]="condition.name" (ngModelChange)="onChange(conditionindex, $event)"> 
    <option *ngFor="#c of catalog;#catalogindex = index" [value]="c.name"> 
       {{c.name}} 
    </option> 
</select> 

和組件文件：

onChange(conditionsIndex, selectedCondition:string): void { 
    this.conditions[conditionsIndex] = this.catalog.find(condition => condition.name == selectedCondition); 
} 

Answer 2

隨着最新版本Angular2（測試14），支持作爲選擇對象已添加。