如何禁用模板驱动形式的所有字段的角度 [英] How to disable all the fields in a template driven form in angular

问题描述

我创建了一个角度为5的模板驱动形式

I created a template driven form in angular 5

我想首先禁用整个表单，并且还希望在单击某些按钮后启用该表单，因此我在form标记中添加了disabled属性，并将其值设置为false，如下所示，(虽然无法正常工作):

I want to disable the whole form at first, and also want the form to be enabled once some button is clicked, Hence I added a disabled property in the form tag and made its value as false as shown below , (this didn't work though):

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

由于上述禁用的属性不起作用，我将禁用的属性更改为

As the above disabled property didn't work, I changed the disabled property as

[attr.disabled] = true

这也不起作用

现在，由于我具有表单元素的引用#formName，因此我在TS文件中使用了它，并尝试更改引用对象内部的禁用属性值

Now as I have the form element's reference which is #formName, I used it in the TS file and tried to change the disabled property value inside the reference object

这就是我所做的:

@ViewChild('formName') formName;


this.formName.disabled = true; 

那也没有用，我收到一条错误消息，说禁用是不能改变的，因为它只是吸气剂

which also didn't work and I got an error message saying disabled cannot be changed as it is only a getter

我应该如何在模板驱动的表单上默认禁用整个表单的角度?

How should I disable the whole form by default in angular on template driven forms ?

先谢谢您了:)

推荐答案

如注释中所述，您可以将表单包装在fieldset标记内并实现以下目的:

As mentioned in the comment you can wrap the form inside a fieldset tag and achieve this as below:

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

并且您可以通过切换局部变量和在disabled/enabled状态之间将句柄的状态更改为:

And you can change handle the state in your controller by toggling a local variable and between the disabled/enabled states as:

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

这篇关于如何禁用模板驱动形式的所有字段的角度的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！