angular - I cannot disable a control with ng-disabled -

//our root app component import {component, ngmodule, version} '@angular/core' import {browsermodule} '@angular/platform-browser'  @component({   selector: 'my-app',   template: `     <div>       <h2>hello {{name}}</h2>       <button (click)="func()">{{hello}}</button>       <button ng-disabled="press" (click)="func2()">click</button>     </div>   `, }) export class app {   name:string;   hello: string = "hello";   press: boolean = false;   constructor() {     this.name = `angular! v${version.full}`   }    func() {     this.hello="blah";     this.press = true;   }    func2() {     alert("here");   } }  @ngmodule({   imports: [ browsermodule ],   declarations: [ app ],   bootstrap: [ app ] }) export class appmodule {} 

i have created simple form, , pasted plunker. app.ts newly created 'angular' project.

this code. expect after press first button, second 1 disabled. however, can alert pop-up.

i have attached plunker code, doesn't work. gratefully accepted.

use [disabled] instead of ng-disabled angular2+

<button [disabled]="press" (click)="func2()">click</button>