【Angular】Materialのmat-buttonを共通化してみた件

import { CommonModule } from '@angular/common';
import { Component, EventEmitter, Output } from '@angular/core';
import { MatButtonModule } from '@angular/material/button';

@Component({
  selector: 'app-button',
  standalone: true,
  imports: [CommonModule, MatButtonModule],
  template: `
    <button mat-button (click)="click()">
      <ng-content></ng-content>
    </button>
  `,
  styles: [
    `
      button {
        /* 何かしらのCSS */
      }
    `,
  ],
})
export class ButtonComponent {
  @Output() event = new EventEmitter();

  click() {
    if (this.event) {
      this.event.emit();
    }
  }
}

<app-button (event)="click()">ボタン</app-button>