Angular 2 Material 2单选按钮默认选择

Question

我有一个单选按钮组，希望根据ngRx可观察对象的值来选择其中一个。

<md-radio-group (change)="onTodoFilter($event.value);">
    <md-radio-button value="SHOW_ALL_TODO">All</md-radio-button>
    <md-radio-button value="SHOW_STARTED_TODO">Started</md-radio-button>
    <md-radio-button value="SHOW_COMPLETED_TODO">Completed</md-radio-button>
  </md-radio-group>

关于 Observable，我有以下解释：

this.todoVisibilityFilter$ = store.select('todoVisibilityFilterReducer');

我想使用异步管道并比较可观察对象的最新/当前值和单选按钮的值，但我无法弄清语法...

- Brett

Answer 1

我自己没有尝试过，但我认为这可以满足您的需求：

<md-radio-group [value]="todoVisibilityFilter | async" 
    (change)="onTodoFilter($event.value);">

请参考 https://github.com/angular/material2/blob/6e4fe5e4172bb150f8d46c9f007ba2c2ff5bdf3a/src/components/radio/README.md，在那里它们使用value属性进行双向绑定。

<md-radio-group [(value)]="groupValue">

- Günter Zöchbauer

Answer 2

这是它：

//it is your component
selectedItem: String = "true";

<md-radio-group [(ngModel)]="selectedItem">
  <md-radio-button value="true">Department</md-radio-button>
  <md-radio-button value="false">Service</md-radio-button>
</md-radio-group>

- Elvin Garibzade