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

【问题标题】：How to disable the input text based on *ngif in angular4如何在angular4中禁用基于*ngif的输入文本
【发布时间】：2020-03-11 22:05:16
【问题描述】：

如果文本框字段上的 ngifcondition 满足，如何禁用文本框。

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">

【问题讨论】：

标签： angular angular4-forms

【解决方案1】：

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

【讨论】：

【解决方案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">

组件.ts

isprecheck: boolean = true;

【讨论】：

【解决方案3】：

如果满足 isprecheck 条件，您当前的代码所做的是向您的输入元素添加一个名为 disbaled 的类。

如果布尔条件否定，也使用 *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”>

【讨论】：