如何设置angular 2中单选按钮的默认值

如何设置angular 2中单选按钮的默认值,angular,angular2-forms,Angular,Angular2 Forms,我有一个模型驱动的表单,希望显示基于无线电输入的字段。 代码:- A. B 获取错误为“无法读取未定义的属性“值” 因为没有选择收音机 如何指定选择第一个作为默认值。您需要传递一个字符串作为收音机的值。现在Angular尝试查找名为a的变量 <md-radio-group class="form-control" [(ngModel)]="selection.value" id="radio1" formControlName="selection"&

我有一个模型驱动的表单,希望显示基于无线电输入的字段。 代码:-


A.
B
获取错误为“无法读取未定义的属性“值” 因为没有选择收音机


如何指定选择第一个作为默认值。

您需要传递一个
字符串作为收音机的值。现在Angular尝试查找名为
a
的变量

<md-radio-group class="form-control" [(ngModel)]="selection.value" 
                id="radio1" formControlName="selection">
  <md-radio-button [value]="'A'">A</md-radio-button>
  <md-radio-button [value]="'B'">B</md-radio-button>
</md-radio-group>

出现此错误是因为尚未创建
选择
formControl。有两种可能的解决方案

  • 使用(
    ?。
    )作为
    *ngIf=selection?.value=='A'
    访问收音机的值

    <div class="form-group" *ngIf="selection?.value=='A'">
      <md-input-container>
          <textarea md-input placeholder="A" class="form-control"
                    formControlName="A"
                    style="border:none;"></textarea>
      </md-input-container>
    </div>
    
    试试这个:

    this.complexForm = fb.group({
                           'name': [null, Validators.required],
                           'description': [null, Validators.required],
                           'file': ["A", Validators.required],
                       });
    

    谢谢Matt,但是当页面加载时,我怎么说选择A作为默认值呢。有什么财产吗?这是一种反应形式,为什么要用这个模型。新的角度。请帮助您需要告诉Angular当收音机输入发生变化时该怎么办。例如,您可以使用
    [(ngModel)]
    (change)
    来执行此操作。请参阅md的github页面上的最后一个代码示例:您可以在组件中初始化您的值。只需指定
    selection.value
    您选择的值,例如在构造函数中或声明变量时的右侧。我已经编辑了我的帖子。
    <div class="form-group" *ngIf="selection?.value=='A'">
      <md-input-container>
          <textarea md-input placeholder="A" class="form-control"
                    formControlName="A"
                    style="border:none;"></textarea>
      </md-input-container>
    </div>
    
    let myForm = new FormGroup({ selection : new FormControl('A') }) 
    
    this.complexForm = fb.group({
                           'name': [null, Validators.required],
                           'description': [null, Validators.required],
                           'file': ["A", Validators.required],
                       });