角度材料-显示垫-单击按钮时出错

// 确保在模板中正确绑定事件
<button mat-button (click)="handleClick()">Click Me</button>

// 在组件类中定义事件处理器
export class MyComponent {
  handleClick() {
    console.log('Button clicked');
    // 处理点击逻辑
  }
}

// 确保数据绑定正确
<button mat-button [disabled]="isDisabled" (click)="handleClick()">Click Me</button>

export class MyComponent {
  isDisabled = false;

  handleClick() {
    if (!this.isDisabled) {
      console.log('Button clicked');
      // 处理点击逻辑
    }
  }
}

// 确保组件之间的交互正确
@Component({
  selector: 'app-parent',
  template: `
    <app-child (buttonClicked)="handleChildButtonClicked()"></app-child>
  `
})
export class ParentComponent {
  handleChildButtonClicked() {
    console.log('Button clicked in child component');
    // 处理子组件按钮点击逻辑
  }
}

@Component({
  selector: 'app-child',
  template: `
    <button mat-button (click)="handleClick()">Click Me</button>
  `
})
export class ChildComponent {
  @Output() buttonClicked = new EventEmitter<void>();

  handleClick() {
    this.buttonClicked.emit();
  }
}