html – Angular2禁用按钮

概述我知道在angular2我可以禁用一个按钮 [disable]属性，例如： <button [disabled]="!isValid" (click)="onConfirm()">Confirm</button> 但是我可以使用[ngClass]还是[ngStyle]？像这样： <button [ngStyle]="{disabled : !isValid}" (click)="onConfirm 我知道在angular2我可以禁用一个按钮
[disable]属性，例如：

<button [Disabled]="!isValID" (click)="onConfirm()">Confirm</button>

但是我可以使用[ngClass]还是[ngStyle]？像这样：

<button [ngStyle]="{Disabled : !isValID}" (click)="onConfirm()">Confirm</button>

谢谢。

解决方法 更新

我想知道，为什么你不想使用angular2提供的[Disabled]属性绑定？处理这种情况的正确方法。我会建议你通过组件方法移动你的isValID检查。

isValIDForm() {    return this.isValID;}<button [Disabled]="!isValIDForm()" (click)="onConfirm()">Confirm</button>

您尝试解释的问题如下

基本上你可以在这里使用ngClass。但是添加类不会限制事件触发。要在有效输入上启动事件，您应该将点击事件代码更改为下面。所以onConfirm只有当字段有效时才会触发。

<button [ngClass]="{Disabled : !isValID}" (click)="isValID && onConfirm()">Confirm</button>

Demo Here

总结

以上是内存溢出为你收集整理的html – Angular2禁用按钮全部内容，希望文章能够帮你解决html – Angular2禁用按钮所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。