材料单选按钮更改事件角4

我试图按如下方式使用MD-单选按钮的变化，输出：材料单选按钮更改事件角4

<md-radio-group [(ngModel)]="selected"> 
    <md-radio-button *ngFor="let a of array" [value]="a" 
       (change)="radioChange()"> 
     {{a}} 
    </md-radio-button> 
</md-radio-group>

TS：

selected: string; 
filter: any; 

radioChange() { 
    this.filter['property'] = selected; 
    console.log(this.filter); 
}

这似乎总是一个在单选按钮后面一步。即当改变选择从无线电A到无线电B，它将console.log无线电A的值。

任何帮助将不胜感激。

干杯，

来源

2017-09-22 Batters

这是因为该模型已经被更新前的变化事件。所以你的selected属性有以前的价值。你的代码更改为以下，以获取有关(change)事件：

<md-radio-group [(ngModel)]="selected"> 
    <md-radio-button *ngFor="let a of array" [value]="a" 
       (change)="radioChange($event)"> 
     {{a}} 
    </md-radio-button> 
</md-radio-group>

...在你的班级，请执行以下操作：

import { MdRadioChange } from '@angular/material'; 
// ... 

radioChange(event: MdRadioChange) { 
    this.filter['property'] = event.value; 
    console.log(this.filter); 
}

链接working demo。

来源

2017-09-22 11:00:15 Faisal

太好了，谢谢。这完美地解决了无线电改变问题。尽管如此，仍然没有更新管道。 SO是新的，我应该把这个问题分成两个并接受你的答案吗？此外，传递$事件与Angular 2材料组件的更广泛的教训，有任何好的教程的一部分的方法？ – Batters

分成两部分。阅读有关事件：http://learnangular2.com/events/ – Faisal

使用Angular 5，您需要从'@ angular/material'导入MatRadioChange，您在radioChange（）方法中获得的事件类型为MatRadioChange，必须将（更改）事件放在所有无线电按钮上。你可以简单地把它放在mat-radio-group上。 – herve

材料单选按钮更改事件角4

回答

相关问题