Как привязать значение входного радио к объекту в угловом? - PullRequest
Новая
       6

Как привязать значение входного радио к объекту в угловом?

0 голосов
/ 05 октября 2018

Я хочу связать радио кнопки с объектами вместо строк.Для этого я попробовал код, подобный следующему: 

<div *ngFor="let object of objects">
    <input type="radio" id="category" [(ngValue)]="object">
</div>

Есть ли способ в Angular связывать объекты со значениями переключателей?

1 Ответ

0 голосов
/ 05 октября 2018

ngValue не будет доступно для переключателей.Он доступен только для списков select.

Вы можете использовать синтаксис привязки атрибута [value], чтобы назначить объект в качестве значения выбранного переключателя.

Используйте это для вашего шаблона:

<div *ngFor="let object of objects">
  <input 
    (change)="onCheck()" 
    [(ngModel)]="selectedCategory" 
    type="radio" 
    id="category" 
    [value]="object">
    {{ object.categoryValue }}
</div>

А в вашем классе: 

import { Component } from '@angular/core';

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.css' ]
})
export class AppComponent  {
  name = 'Angular';

  selectedCategory;

  objects = [
    {categoryName: 'Category1', categoryValue: 'Category1'},
    {categoryName: 'Category2', categoryValue: 'Category2'},
    {categoryName: 'Category3', categoryValue: 'Category3'},
  ];

  onCheck() {
    console.log(this.selectedCategory);
  }

}

Вот вам Образец StackBlitz для вашей ссылки.

...