我想在angular2中建立一个下拉列表,只要用户选择一个项目,它就会将下拉值重置为默认值。这是我到目前为止使用的代码:
//My Components.ts
import { Component } from '@angular/core';
import { FormsModule } from '@angular/forms';
@Component({
selector: 'awesome-component',
template: `
<select [(ngModel)]="selectedModule" (ngModelChange)="onChange($event)">
<option *ngFor="let module of modules" [value]="module._id">
{{module.moduleName}}</option>
</select>
`
})
export class AwesomeComponent implements OnInit {
modules: any[];
selectedModule: any = null;
ngOnInit(){
this.loadModules();
}
loadModules(){
this.modules = [];
this.modules.push({moduleName:'Default Value',_id:1});
this.modules.push({moduleName:'2017',_id:2});
this.modules.push({moduleName:'2018',_id:3});
this.modules.push({moduleName:'2019',_id:4});
this.selectedModule = 1;
}
onChange(modules) {
alert("Current id is:" + this.selectedModule+ " Value reset to default");
this.selectedModule = 1;
}
}
这是一个有效的Plunker,可以说明问题。
目标是每当警报框关闭时我想将下拉列表更新为默认值。