在角度6(和7)中为Mat按钮切换创建主题

npm install --save @angular/material @angular/cdk @angular/animations

import { Component } from '@angular/core';
import { MatButtonModule } from '@angular/material/button';
import { MatButtonToggleModule } from '@angular/material/button-toggle';
import { MatIconModule } from '@angular/material/icon';
import { MatToolbarModule } from '@angular/material/toolbar';

export class YourComponent {
  selectedTheme: string = 'light-theme';
}

<mat-button-toggle-group [(ngModel)]="selectedTheme">
  <mat-button-toggle value="light-theme">Light Theme</mat-button-toggle>
  <mat-button-toggle value="dark-theme">Dark Theme</mat-button-toggle>
</mat-button-toggle-group>

.light-theme {
  background-color: #ffffff;
  color: #000000;
}

.dark-theme {
  background-color: #000000;
  color: #ffffff;
}

<button mat-button [ngClass]="selectedTheme">Toggle Theme</button>