【问题标题】:Using NgModel to bind to radio group input for Angular Material使用 NgModel 绑定到 Angular Material 的单选组输入
【发布时间】:2017-12-03 00:18:13
【问题描述】:

我有一个单选组,我想从我的组件代码中设置它的值。但是我似乎无法使用 [(ngModel)] 设置初始值。我没有收到任何错误或任何东西来说明为什么它没有显示选中的单选按钮。

<div class="form-group">
  <mat-radio-group  [(ngModel)]="selectedStatus" formControlName="completed">
    <mat-radio-button  [value]="1">Call Complete</mat-radio-button>
    <mat-radio-button [value]="2">Call Incomplete</mat-radio-button>
  </mat-radio-group>
</div>

组件代码sn-ps:

selectedStatus: Array<string>;



private initForm() {
    this.eventEditForm = new FormGroup({          
      'completed': new FormControl()
      });          
      this.selectedStatus = this.data[0].completed;
    }

this.data[0].completed 从数据服务返回 1 或 2。

【问题讨论】:

  • 好吧,selectedStatus 应该是 1 或 2。但是您将它声明为 Array。它应该是一个数字,因为 1 和 2 是数字。编译器错误消息应该告诉你。你为什么不读呢?
  • 编译器没有显示任何错误。我用数字试过了,没有效果。所以有点困惑。
  • 在 plunkr 中发布一个完整的最小示例来重现问题。

标签: angular angular-material


【解决方案1】:

你的变量selectedStatus不应该是字符串数组,应该是数字,改成。

selectedStatus:  number ;  

WORKING STACKBLITZ

【讨论】:

  • stackblitz 链接已失效 :-(
  • 在 Angular Material 7 中,formControlName 变为 -> name (@Input() name: string)。 material.angular.io/components/radio/api "单选按钮组的名称。该组内的所有单选按钮都将使用此名称。"
猜你喜欢
  • 2019-12-02
  • 2017-08-16
  • 1970-01-01
  • 2018-12-05
  • 2023-03-16
  • 1970-01-01
  • 2017-10-17
  • 2019-10-24
  • 2019-02-21
相关资源
最近更新 更多