Angular 2: ngМодель привязки для радиовхода булевого типа

Question

В Angular 2 я хотел бы привязать 2 варианта ввода переключателя в 1 группе к свойству модели булевого типа, однако либо я не могу выбрать один переключателей или запусков в другую проблему с неправильным связыванием. Я пробовал следующее в своем html.

*.component.html:

Error: myModel.modelProperty is always: false, no matter which radio button is selected. 

<div class="form-group"> 
     <label for="modelProperty">Model Property: </label> 
     <form action=""> 
      <input type="radio" [ngModel]="_model.modelProperty" (click)="_model.modelProperty=true" name="modelProperty" value=true>Yes<br> 
      <input type="radio" [ngModel]="_model.modelProperty" (click)="_model.modelProperty=false" name="modelProperty" value=false>No 
     </form> 
</div> 

<div>{{_model.modelProperty}}</div> 

*.component.html:

Error: myModel.modelProperty is [Object object], only No radio button can be selected, if either Yes or No radio buttons is clicked. 

<div class="form-group"> 
      <label for="modelProperty">Model Property: </label> 
      <form action=""> 
       <input type="radio" [(ngModel)]="_model.modelProperty" name="modelProperty" ngValue=true>Yes<br> 
       <input type="radio" [(ngModel)]="_model.modelProperty" name="modelProperty" ngValue=false>No 
      </form> 
    </div> 

    <div>{{_model.modelProperty}}</div> 

Я использую следующий

*.component.ts для всех *.component.html вариантов выше:

import {Component, Input} from 'angular2/core'; 
import {NgForm} from 'angular2/common'; 
import {Model} from './model'; 
@Component({ 
    selector: 'my-form', 
    templateUrl: 'app/.../*.component.html' 
}) 

export class *Component { 

     _model = new Model(..., false, ...); //false is the Model property: .modelProperty 

     constructor(){} 

     ... 
} 

Answer 1

В подобных случаях я использую вашу первую версию кода с [checked] вместо [ngModel].

Этот код работает для меня:

<form action=""> 
    <input type="radio" [checked]="_model.modelProperty" 
     (click)="setProperty($event.target.checked)" 
     name="modelProperty">Yes<br> 
    <input type="radio" [checked]="!_model.modelProperty" 
     (click)="setProperty(!$event.target.checked)" 
     name="modelProperty">No 
</form> 

setProperty(inChecked: boolean) { 
    this._model.modelProperty = inChecked; 
} 

Answer 2

Чтобы получить свой HTML значение для оценки как логическое значение, используйте: [value]="true"

Answer 3

Для булево, [(ngModel)] работает с [value]. [(ngModel)] не удалось проверить по умолчанию value. Например: <input type="radio" id="idYes" name="Preferred-group" [value]="true" [(ngModel)]="IsContactPreffered"> отлично работает.