Angular 2+ - ngModel不绑定初始值,以便在ngFor循环中进行选择
问题描述:
如果我在ngFor循环中创建了选择输入,然后通过ngModel将值绑定到某个数组 - 这些选择不会从它获得它们的初始值数组(就像它只创建一个单向绑定)。下面是简单的例子在plunker: https://plnkr.co/edit/LX7XyrHcMGH8avZYA0pv?p=previewAngular 2+ - ngModel不绑定初始值,以便在ngFor循环中进行选择
@Component({
selector: 'my-app',
template: `
<div *ngFor="let select of test; let i = index" >
<select name="test" [(ngModel)]="vals[i]">
<option *ngFor="let item of select" [ngValue]="item">{{item.lol}}</option>
</select>
</div>
<div style="display: flex">
<div *ngFor="let val of vals; let last = last;">
{{val.lol}}{{last? '' : ','}}
</div>
</div>
`,
})
export class App {
test: any = [
[{ lol: '1' }, { lol: '2' }, { lol: '3' }],
[{ lol: '4' }, { lol: '5' }, { lol: '6' }],
[{ lol: '7' }, { lol: '8' }, { lol: '9' }],
];
vals: any[] = [{ lol: '1' }, { lol: '4' }, { lol: '7' }];
constructor() {}
}
答
在这个例子中使用[compareWith]解决了这个问题
UPDATE: 虽然固定的例子,在我的代码ngModel正在更新值只有一个选择的输入,由ngFor生成。对我来说,设置[ngModelOptions] =“{standalone:true}”已经解决了这个问题。希望它可以帮助别人......