我无法禁用ng-disabled控件

时间:2017-08-21 05:25:19

标签: angular

//our root app component
import {Component, NgModule, VERSION} from '@angular/core'
import {BrowserModule} from '@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 {}

我创建了一个非常简单的表单,并将其粘贴在Plunker上。这是来自新创建的&#39; Angular&#39;的应用程序。项目。

这是代码。我希望在按下第一个按钮后,第二个按钮将被禁用。但是,我总能得到提示弹出窗口。

我附上了一些不起作用的plunker代码。任何帮助都感激不尽。

1 个答案:

答案 0 :(得分:3)

使用[disabled]代替ng-disabledAngular2+

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