ラジオボタン応答の典型的な形

注意事項:

  フォームと名前値でラジオボタンが同じでなければなりませんfromControlName

1.インポート

インポート{ReactiveFormsModule}角度/フォーム@ 'から
 
2.htmlテンプレート
 
<FORM [formGroup] = "FG">
    <ラベル>セックス:</ label>は
    <input type = "ラジオ" ID = "男性"  NAME = "性別"  値= '1'  formControlName = "性別" >
    <ラベル= "男性" のために>男</ label>は
    <input type = "ラジオ" ID = "女性"  NAME = "性別"   値= '2'  formControlName = "性別" >
    <ラベル= "女性" のために>女</ label>は
    <ボタン(クリック)= "実行()">跳转</ボタン>
</フォーム>
 
3. TSファイル
「@角度/コア」からインポート{コンポーネント、のOnInit}。
インポート{FormGroup、FormControl}角度/フォーム@ 'から。

@成分({
  セレクター:「アプリリスト」
  templateUrl: './list.component.html'
  styleUrls:[」./list.component.css']
})
エクスポートクラスListComponent実装のOnInit {

  公開値:文字列= '2';
  コンストラクタ(){}

  ngOnInit(){
    this.backGoup();
  }
  
  公共FG:FormGroup。
  backGoup(){
     this.fg =新しいFormGroup(
      {
        性別:新しいFormControl(this.value)
      }
    );
  }
  ラン(){
  解体の形で//活字体 
  //セックスの値のキー値を削除しないでください
    ましょう{性別} = this.fg.value。
    console.log(性別)。
  }

}
 

おすすめ

転載: www.cnblogs.com/kukai/p/12142433.html