25

disabledモデル駆動型フォーム内で使用しようとしています。私は次のフォームを持っています：

this.form = this.formBuilder.group({
    val1: ['', Validators.required],
    val2: [{value:'', disabled:this.form.controls.val1.valid}]
});

おそらく内部で使用しているため、エラーが発生します（controlsのが見つかりません） 。this.formthis.formthis.form

どうすれば修正できますか？

PS私も[disabled]='...'html内に追加しようとしましたが、代わりにformBuilderを使用する必要があるという警告が表示されます

4

1 に答える 1

51

そうです、問題は、this.formまだ開始されていないときに変数 ( ) を参照しているためです。幸運なことに、あなたの場合、実際にはval2フォーム コントロールでフォーム グループを参照する必要はありません。コードは次のように書き直すことができます。

let val1Control = this.formBuilder.control('', Validators.required);
this.form = this.formBuilder.group({
    val1: val1Control ,
    val2: [{value:'', disabled: val1Control.valid}]
});

ただし、このブロックは、の有効性disabledを監視せずに val2 コントロールの値を開始するだけです。val1Controlこれを行うには、にサブスクライブする必要がありますval1Control.statusChanges。

let val1Control = this.formBuilder.control('', Validators.required);
let val2Control = this.formBuilder.control({value:'', disabled: !val1Control.valid});
this.form = this.formBuilder.group({
  val1: val1Control,
  val2: val2Control
})

val1Control.statusChanges.subscribe((newStatus) => {
  if (val1Control.valid) {
    val2Control.enable();
  } else {
    val2Control.disable();
  }
});

これが作業中のプランカーです: http://plnkr.co/edit/kEoX2hN9UcY4yNS3B5NF

于 2016-09-25T03:17:54.733 に答える