Angular2 disable button
Update
I'm wondering. Why don't you want to use the [disabled] attribute binding provided by Angular 2? It's the correct way to dealt with this situation. I propose you move your isValid check via component method.
<button [disabled]="! isValid" (click)="onConfirm()">Confirm</button>The Problem with what you tried explained below
Basically you could use ngClass here. But adding class wouldn't restrict event from firing. For firing up event on valid input, you should change click event code to below. So that onConfirm will get fired only when field is valid.
<button [ngClass]="{disabled : !isValid}" (click)="isValid && onConfirm()">Confirm</button>
I would recommend the following.
<button [disabled]="isInvalid()">Submit</button>
Yes you can
<div class="button" [ngClass]="{active: isOn, disabled: isDisabled}" (click)="toggle(!isOn)"> Click me! </div>https://angular.io/docs/ts/latest/api/common/NgClass-directive.html