如何在Angular2中的某些div中只读取所有输入？

Question

我有一个包含许多输入的页面,我想让它' readOnly'我找到这个解决方案:如何在Angular2 Typescript中更改HTML元素readonly和required属性？

但是我不想单独为每个输入做这件事.

如何readOnly在某个div中为所有输入添加属性.

Answer 1

在输入字段中尝试此操作:

[readonly]="true"

希望,这会奏效.

Answer 2

如果您想要整个组,而不是一次只有一个字段,则可以使用HTML5 <fieldset>标记.

<fieldset [disabled]="killfields ? 'disabled' : null">

    <!-- fields go here -->

</fieldset>

Answer 3

如果使用反应式表单,您还可以禁用FormGroup中的整个表单或任何控件子集myFormGroup.disable().

Answer 4

如果要立即禁用Angular形式的所有输入，请执行以下操作：

1-反应形式：

myFormGroup.disable() // where myFormGroup is a FormGroup 

2-模板驱动的表单（NgForm）：

您应该在NgForm变量（例如，名为myNgForm）中获取NgForm，然后

myNgForm.form.disable() // where form here is an attribute of NgForm 
                      // & of type FormGroup so it accepts the disable() function

如果是NgForm，请注意在正确的时间调用disable方法

为了确定何时调用它，您可以在此Stackoverflow答案中找到更多详细信息。

Answer 5

所有输入都应替换为自定义指令，该指令读取单个全局变量以切换只读状态。

// template
<your-input [readonly]="!childmessage"></your-input>

// component value
childmessage = false;