如何禁用angular4中基于*ngif的输入文本

Question

如果 ngif 条件满足文本框字段，如何禁用文本框。

Below didnt work for me


<input [ngClass]="{'disbaled' : !isprecheck}" type="text" class="form-control" id="title" name="title"
                           [(ngModel)]="stunt.title" #Title="ngModel" required minlength="1" maxlength="255">

Answer 1

如果您像现在一样使用声明式形式，请使用 disabled 属性，例如 [disabled]="condition"，但如果您正在学习 angular，我建议您查看反应式形式，它们更强大: https://angular.io/guide/reactive-forms

Answer 2

component.html

<input [disabled]="isprecheck" type="text" class="form-control" id="title" name="title" [(ngModel)]="stunt.title" #Title="ngModel" required minlength="1" maxlength="255">

component.ts

isprecheck: boolean = true;

Answer 3

如果满足 isprecheck 条件，您当前的代码所做的是将名为 disbaled 的 class 添加到您的输入元素。

如果布尔条件为负，还可以使用 *ngIf 隐藏您的输入。

如果您想显示元素但禁用它，请将 [disabled] 与您的布尔值一起使用。

<input [ngClass]="{'disbaled' : !isprecheck}" type="text" class="form-control" id="title" name="title" [(ngModel)]="stunt.title" #Title="ngModel" required minlength="1" maxlength="255" [disabled]=“!isprecheck”>

如何禁用angular4中基于*ngif的输入文本

How to disable the input text based on *ngif in angular4

angular

angular4-forms