下拉值不使用Angular2在NGMODEL中结合



我在Angular2中使用ng模型的下拉列表,当我更改模型

时,我的视图没有更新

 //intialize the variable
 addplanhours:any[];
 
 this.addplanhours=[{name: '--sel--',value:0}, {name: 'Head start',value:1}, {name: 'Nice going',value:2},{name: 'On Track',value:3},{name: 'Keep On trying',value:4},{name: 'Making process',value:5},{name: 'Wrapping up',value:6}];
 
 //function of electrifyonchange
 electrifyonChange(value) {
 for(var i=0;i<=this.addplanhours.length;i++){
   this.electrify= value;
   console.log("new value",this.electrify);
 }
<span>
                  <span class="addnotefont1">Electrifying</span>
                  <select class="addplanpicker"[(ngModel)]="electrify" (ngModelChange)="electrifyonChange($event)">
               <option *ngFor="let a of addplanhours" [ngValue]="a.value">{{a.name}} </option>
          </select>
                </span>

[ngValue]可以容纳任何类型的对象或值,因此您可以使用 [compareWith]函数来维护下拉状态,因为您正在使用对象:

<select class="addplanpicker" [(ngModel)]="electrify" [compareWith]="isplanHourSelected"> 
    <option *ngFor="let a of addplanhours" [ngValue]="a">{{a.name}} </option>
</select>

isplanHourSelected(o1, o2) {
    return o1 && o2 && o1.value == o2.value
}

现在,如果要在Electrify中选择任何值时,您可以使用特定事件,现在可以使用electrify,则可以使用OnChange策略。

最新更新