在 Angular2 中，单向绑定到一组无线电输入的名称属性不起作用。例如：
<div [ngFormModel]="form">
<input type="radio" [name]="varName" [id]="id1" ngControl="r1">
<input type="radio" [name]="varName" [id]="id2" ngControl="r2">
<input type="radio" [name]="varName" [id]="id3" ngControl="r3">
</div>
加载页面时，名称不是任何这些无线电输入的属性。
【问题讨论】：
【讨论】：
[name]="variable" 在某些条件下适用于某些元素，但并非总是如此。所以总是使用[attr.name] 似乎更省钱。如果您希望它也显示在元素上
label 元素的htmlFor）与它们所反映的属性（for）的名称不同。 Angular 造成的原因是，有时某些指令应用于具有与属性同名的输入的元素，但如果不使用[attr.name]，这些指令不会反映到属性中，但这是出于性能原因。更新属性代价高昂，因为它们会更改 DOM，甚至会导致重新渲染。
如果这与绑定到 select 属性的方式类似，则 name 属性将设置在 javascript dom 元素上。这意味着虽然它没有显示在视图中，但它实际上已在 HTMLElement 上设置。
用以下代码说明：
import {Component} from '@angular/core'
import {ControlGroup, Control} from '@angular/common'
@Component({
selector: 'my-app',
providers: [],
template: `
<form [ngFormModel]="group">
<input type="radio" [attr.name]="name" ngControl="test">
<input type="radio" [attr.name]="name" ngControl="test2" ref-example>
<input type="radio" [name]="name" ngControl="test3" ref-exampletwo>
<p>using [attr.name]: {{example.name | json }}</p>
<p>using [name]: {{exampletwo.name | json }}</p>
</form>
`
})
export class App {
name: "test"
group: ControlGroup
constructor() {
this.group = new ControlGroup({
test: new Control(""),
test2: new Control(""),
test3: new Control("")
})
}
}
http://plnkr.co/edit/xHkgb0BgPzZLwyFpTo1W?p=preview
你真正想做的是：
[attr.name]="name"
这将设置元素的属性。
【讨论】：
FORM_DIRECTIVES 和 FORM_PROVIDERS 全球可用，无需提供。 ... 在 directives 和 providers 中是多余的。为什么你注入FormBuilder，然后使用new ControlGroup(...)。只需使用 `formBuilder.group(...)´ 代替。