Question

如何检查按钮是否被按下？

<anotherComponent [isPressedOkButton]="xxx">    
<button #okButton>

p.s在JSF中存在这样的机会 - “不是空的param [button.clientId]”

Answer 1

如果要使用另一个组件的输入来创建变量，则必须在Component内部创建变量。如果按下按钮，则设置此变量。

<another-component [isPressedOkButton]="btn.attachedProp"></another-component>
<button #btn (click)="yourClickFunction(); btn.attachedProp = true;"></button>

查看有效的演示：https://plnkr.co/edit/AUN40WbtoQDK4PkS4a61?p=preview

import {Component, NgModule, Input} from '@angular/core'
import {BrowserModule} from '@angular/platform-browser'

@Component({
  selector: 'my-other',
  template: `
    <div>
      <h4>other component...</h4>
      button of main component was {{buttonIsPressed ? '' : 'NOT'}} pressed.
    </div>
  `,
})
export class OtherCmp {

  @Input() buttonIsPressed = false;

  name:string;
  constructor() {
    this.name = 'Angular2'
  }
}

@Component({
  selector: 'my-app',
  template: `
    <div>
      <h2>Hello {{name}}</h2>
      <button #btn (click)="btn.anyAttachedProperty = true;">click me ! :)</button>
      <br />
      <my-other [buttonIsPressed]="btn.anyAttachedProperty"></my-other>
    </div>
  `,
})
export class App {

  name:string;
  constructor() {
    this.name = 'Angular2'
  }
}

@NgModule({
  imports: [ BrowserModule ],
  declarations: [ App, OtherCmp ],
  bootstrap: [ App ]
})
export class AppModule {}

Angular2检查是否按下了按钮

1 个答案: