查看我创建的plunker代码。当我点击切换显示按钮2次我应该得到所选项目。此示例代码是一般angular2应用程序
的组件的一部分@Component({
selector: 'my-app',
template: `<div *ngIf="show"><select [(ngModel)]="selectedDeviceObj" name="sel3">
<option [ngValue]="i" *ngFor="let i of deviceObjects">{{i.name}}</option>
</select></div>
{{selectedDeviceObj | json}}
<br/><br/><br/>
<button (click)="changeShow()">toggle show</button>
`
//directives: []
})
export class AppComponent {
changeShow(){
this.deviceObjects = [{name: 1}, {name: 2}, {name: 3}];
this.show=!this.show;
}
show=true;
title = "Angular 2 RC.4 - select";
devices = 'one two three'.split(' ');
selectedDevice = 'two';
deviceObjects = [{name: 1}, {name: 2}, {name: 3}];
selectedDeviceObj = this.deviceObjects[1];
//constructor() { console.clear(); }
onChange(newValue) {
console.log(newValue);
this.selectedDevice = newValue;
// ... do other stuff here ...
}
onChangeObj(newObj) {
console.log(newObj);
this.selectedDeviceObj = newObj;
// ... do other stuff here ...
}
}