如何设置Angular 2被动形式中下拉(选择选项)输入的默认值
我有一个对象的下拉列表。它是一个person对象,其属性为如何设置Angular 2被动形式中下拉(选择选项)输入的默认值,angular,typescript,Angular,Typescript,我有一个对象的下拉列表。它是一个person对象,其属性为id、firstName和lastName <select formControlName="person"> <option *ngFor='let person of persons" [ngValue]="person">{{person.firstName+' '+person.lastName}}</option> </select> 不使用ngModel的方法。您还可
id
、firstName
和lastName
<select formControlName="person">
<option *ngFor='let person of persons" [ngValue]="person">{{person.firstName+' '+person.lastName}}</option>
</select>
不使用ngModel的方法。您还可以使用*ngFor中每个迭代的索引(i)选择下拉列表的默认值。您可以对option元素使用“selected”属性,然后将索引(i)的值设置为与要设置为默认值的选项等效的值。在这里,我默认选择了第二个选项。索引是数组中每个选项的索引。
下面是为相同目的稍微修改的代码:
@组成部分({
选择器:“我的应用程序”,
模板:`
{{option.name}
您可以使用formControl并使用它设置默认值。根据组件初始化时是否有值,您可以在构建表单时设置值,否则在收到值时使用patchValue
。因此,在构建表单时(如果您有数据)
PS,通常我们在这里不使用绑定整个对象的ngValue
,但是如果你想/需要这样做,当然也可以:)在我在这里发布问题之前,我已经尝试过了@AJT82。它选择了人物,但没有在视图中更新:(“它选择了人物,但没有更新视图”这到底是什么意思?我使用{{personForm | json打印formcontrols值,这样我可以查看表单值是否更改,并查看是否选择了此人。但在下拉列表的实际视图中,它没有选择任何内容。好吧,我为您制作了一个plunker,您能否将其分叉并重新创建该问题,我很乐意查看:)嗨@AJT_82我能在stackoverflow外面给你留言吗?我想问更多的问题。我已经试着解决这个问题两天了,但我仍然无法解决它。
ngOnInit() {
this.myForm = this._fb.group({
person: [this.persons[1]]
});
}