angular - 具有动态变量的 ngModel

Question

当使用从数组中ngModel获取属性来发出值来碰撞对象时，我遇到了一些问题。bumpDetail.name

我在下面粘贴了我的代码片段。
谁能帮我检查一下并告诉我哪里做错了？谢谢你。

<p *ngFor="let bumpDetail of bumpDetail">
    <input type="checkbox" id="device" [(ngModel)]={{bump.bumpDetail.name}}/>
    <label for="device">{{bumpDetail.name}}</label>
</p>

 Bump[] = [{
"name": "bump_1",
"status": true
}, {
"name": "bump_2",
"status": false
 }, {
"name": "bump_3",
"status": true
}]

这是错误。

解析器错误：在 ng:///AppModule/SettingComponent.html@129:59 ("p *ngFor="让bumpDetail的bumpDetail">

Answer 1

[]并且从不{{}}一起使用。一个或另一个

[(ngModel)]="this[bumpDetail.name]"

{{}}仅用于字符串插值。

Answer 2

有一个错误[(ngModel)]={{bumpDetail.name}}

它应该是：[(ngModel)]="bumpDetail.status"

{{}}在使用[(ngModel)]或任何其他 ng-directive 时，您不需要。

其次，我认为这里可能有问题，<p *ngFor="let bumpDetail of bumpDetail">请验证您的变量名称是否正确，并且这两个不能相同。

我会把它改成这样：数组<p *ngFor="let bumpDetail of bumpDetailArray">在哪里bumpDetailArray

Answer 3

首先要掌握基础知识 {{}} 是一个表达式，[(ngModel)] 用于两种方式绑定，其中 () 正在发射，[] 用于绑定。你需要做的是[(ngModel)]="bumpDetail.name"，如果你想打印它然后您需要使用表达式 like {{bumpDetail.name}}。您不能像上面使用的那样同时使用它们。