角度2の条件付きラジオボタンを呼び出す方法は？

Question

私が最初に選択してから、私はボタンをクリックすると、私はその後、ディスプレイが偽べきと私は2番目を選択し、ボタンをクリックすると、その後

以下のようにdisplayConflictが真べき私はこの方法を試してみましたが、私は得ることができなかった2つのラジオボタンを持っています溶液。

<input #m [checked]="model.Gender == m.value" (click)="model.Gender = m.value" name="Gender" value="male" type="radio"> 
<input #f [checked]="model.Gender == f.value" (click)="model.Gender = f.value" name="Gender" value="female" type="radio"> 


<p-button (click)="showExist(model.Gender);" pButton type="button" label="Accept"></p-button> 

private display: boolean = false; 
public displayConflict: boolean = false; 
public showExist(str: String): void { 
     if (str === "male") { 
      this.display = false; 
     } else { 
      this.displayConflict = true; 
     } 
    } 

Answer 1

これは実施例である：

//our root app component 
import {Component} from '@angular/core' 

@Component({ 
    selector: 'my-app', 
    providers: [], 
    template: ` 
    <div> 
     <h2>Hello {{name}}</h2> 

    <label>Male</label> 
     <input #m [checked]="model.Gender == m.value" (click)="model.Gender = m.value" name="Gender" value="male" type="radio" /> 
     <label>Female</label> 
<input #f [checked]="model.Gender == f.value" (click)="model.Gender = f.value" name="Gender" value="female" type="radio" /> 
<br/> 
<button (click)="showExist(model.Gender);" pButton type="button" label="Accept"> 
Next</button> 

<div *ngIf="!display || displayConflict"> Hide me, by selecting and hitting Next</div> 

    </div> 
    `, 
    directives: [] 
}) 
export class App { 
    constructor() { 
    this.name = 'Angular2 (Release Candidate!)' 
    } 

    model:any={"Gender": "female" } 
    private display: boolean = false; 
public displayConflict: boolean = false; 
public showExist(str: String): void { 
     if (str === "male") { 
      this.display = false; 
      this.displayConflict = true; 
     } else { 
      this.display = true; 
      this.displayConflict = false; 
     } 
    } 
}