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

Question

我有一个包含很多输入的页面，我想将其设为“readOnly” 我找到了这个解决方案：

但我不想为每个输入单独执行此操作。

如何将 readOnly 属性添加到某些 div.

中的所有输入

Answer 1

在输入字段中试试这个：

[readonly]="true"

希望，这会奏效。

Answer 2

只需将容器 div 'pointer-events' 的 css 属性设置为 none 即 'pointer-events:none;'

Answer 3

如果您想做一整组，而不是一次只做一个字段，您可以使用 HTML5 <fieldset> 标签。

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

    <!-- fields go here -->

</fieldset>

Answer 4

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

Answer 5

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

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

// component value
childmessage = false;

Answer 6

你可以这样做。打开一个 ts 文件广告，在那里创建一个包含您想要的输入的界面，并在您想要显示的页面中导出 class 写入

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

在你的模板中这样做 *ngFor="let yourtype of yourinterface"

Answer 7

如果您要一次禁用 Angular 表单中的所有输入：

1-反应形式：

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

2- 模板驱动表单 (NgForm)：

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

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

在 NgForm 的情况下，注意在正确的时间调用禁用方法

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

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

How to make readonly all inputs in some div in Angular2?

readonly

typescript

angular2-forms

angular