1. ホーム
  2. angular

[解決済み] Reactiveなフォーム - disabled属性

2022-05-01 03:32:19

質問

を使おうとしています。 disabled 属性から formControl . それをテンプレートに入れると、動作します。

<md-input formControlName="id" placeholder="ID" [disabled]="true"></md-input>

でも、ブラウザが警告してくれるんです。

<ブロッククオート

disabled属性をreactiveフォームで使用しているようです。 ディレクティブを使用します。disabled を true に設定すると コンポーネントクラスでこのコントロールを設定すると、 disabled 属性が実際に DOM に設定されます。 となります。changed after checked "エラーを回避するために、この方法を使用することをお勧めします。

  Example: 
  form = new FormGroup({
    first: new FormControl({value: 'Nancy', disabled: true}, Validators.required),
    last: new FormControl('Drew', Validators.required)
  });

そこで、それを FormControl , そしてテンプレートから削除しました。

constructor(private itemsService: ItemsService) {
    this._items = [];
    this.myForm = new FormGroup({
        id: new FormControl({value: '', disabled: true}, Validators.required),
        title: new FormControl(),
        description: new FormControl()
    });
    this.id = this.myForm.controls['id'];
    this.title = this.myForm.controls['title'];
    this.description = this.myForm.controls['description'];
    this.id.patchValue(this._items.length);
}

しかし、これはうまくいきません(これは input ). 何が問題なのでしょうか?

解決方法は?

私はこれまで [attr.disabled] なぜなら、私はプログラムによるenable()/disable()よりも、このテンプレートによる駆動の方が、IMOとして優れていると思うからです。

変更

<md-input formControlName="id" placeholder="ID" [disabled]="true"></md-input>

になります。

<md-input formControlName="id" placeholder="ID" [attr.disabled]="true"></md-input>

新しいマテリアルチェンジの場合 md-inputmat-input .