当我试图给出一个下拉菜单.默认情况下,我需要选择需要显示的值.当我没有使用ngModel时,我能够显示默认值.
没有ngModel
<select class="form-control"> <option *ngFor="let type of ListType" [value]="type .id">{{type .name}}</option> </select>
上面的代码在编译时工作正常.我能够在列表中看到要显示的第一个值.
使用ngModel
<select class="form-control" [(ngModel)]="selectedListType"> <option *ngFor="let type of ListType" [value]="type .id">{{type .name}}</option> </select>
这是显示为空.
方法尝试:
>使用选择
< option * ngFor =“let List of ListType”[selected] =“type.name ==='Dislike'”[value] =“type .id”> {{type .name}}< / option>
>使用了attr.Selected
< option * ngFor =“let List of ListType”[ngValue] =“type”[attr.selected] =“type .name == type.name?true:null”> {{type.name}}< /选项> 编辑
>甚至尝试通过模型设置所选值仍然没有结果.
还有其他方法吗?
要么
难道我做错了什么?
解决方法
您正在将select的值定义为id值,而您正在使用name属性提供selectedListType.所以你要做的是为selectedListType提供id值,例如,如果你的ListType如下所示:
[{id:1,name: 'Dislike'},{...}]
您希望将selectedListyType值设置为1.其他选项是,如果您不知道id值,则可以执行以下操作:
ngOnInit() { this.selectedListType = this.ListType.find(x => x.name === 'Dislike').id }
然后您的模板将如下所示:
<select class="form-control" [(ngModel)]="selectedListType"> <option *ngFor="let type of ListType" [value]="type.id">{{type.name}}</option> </select>