web-dev-qa-db-ja.com

angularでテンプレート駆動型フォームのすべてのフィールドを無効にする方法

angular 5でテンプレート駆動フォームを作成しました

最初にフォーム全体を無効にし、いくつかのボタンがクリックされたときにフォームも有効にしたいので、次に示すように、フォームタグにdisabledプロパティを追加し、その値をfalseにしました（これは機能しませんでした）ただし）：

<form #formName = "ngForm" [disabled]="true">
</form>

上記の無効化プロパティが機能しなかったため、無効化プロパティを次のように変更しました

[attr.disabled] = true

これもうまくいきませんでした

フォーム要素の参照である#formNameがあるので、TSファイルでそれを使用して、参照オブジェクト内の無効なプロパティ値を変更しようとしました

これが私がやったことです：

@ViewChild('formName') formName;


this.formName.disabled = true;

これも機能せず、無効化はゲッターにすぎないため変更できないというエラーメッセージが表示されました

angular=テンプレート駆動フォームでは、デフォルトでフォーム全体を無効にする必要がありますか？

前もって感謝します ：）

angulartypescriptangular-forms
10
Harish

コメントで述べたように、フォームをfieldsetタグ内にラップして、以下のようにこれを実現できます。

<form>
    <fieldset [disabled]="fieldsetDisabled">
        <!-- YOUR FIELDS HERE -->
    </fieldset>
</form>

また、ローカル変数をトグルして、disabled/enabledの状態を次のように切り替えることで、コントローラーの状態のハンドルを変更できます。

this.fieldsetDisabled = true;  // Disables the fieldset
this.fieldsetDisabled = false; // Enables the fieldset
17
Aravind