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

Question

我有一个包含许多输入的页面，我想让它成为＆＃39; readOnly＆＃39; 我找到了这个解决方案：How to change HTML element readonly and required attribute in Angular2 Typescript?

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

如何将readOnly属性添加到某个div中的所有输入。

Answer 1

在输入栏中尝试此操作：

[readonly]="true"

希望，这会奏效。

Answer 2

如果您想要整个群组，而不是一次只有一个字段，则可以使用HTML5 <fieldset>代码。

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

    <!-- fields go here -->

</fieldset>

Answer 3

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

Answer 4

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

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

// component value
childmessage = false;

Answer 5

如果您要立即禁用Angular形式的所有输入：

1-反应形式：

user

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

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

user

对于NgForm，请注意在正确的时间调用disable方法

要确定何时调用它，您可以找到更多详细信息in this Stackoverflow answer

Answer 6

只需将容器div'指针 - 事件'的css属性设置为无，即'pointer-events：none;'

Answer 7

你可以这样做。 打开一个ts文件广告，在那里创建一个包含所需输入的界面，并在要在导出类写入

下显示的页面中

readonly yourinterface = yourinterface
readonly level: number[] = [];

并在您的模板中执行此操作     * ngFor =“让你的接口类型”