首先,在组件中引入Angular Material的主题服务:
import { ThemePalette } from '@angular/material/core';
import { ThemeService } from './theme.service';
然后,使用注入的主题服务来获取当前主题,并将主色、强调色和警告色设置为该主题的颜色:
export class MyComponent implements OnInit {
primaryColor: ThemePalette;
accentColor: ThemePalette;
warnColor: ThemePalette;
constructor(private themeService: ThemeService) { }
ngOnInit() {
this.primaryColor = this.themeService.getCurrentTheme().primary;
this.accentColor = this.themeService.getCurrentTheme().accent;
this.warnColor = this.themeService.getCurrentTheme().warn;
}
}
最后,在HTML模板中使用这些颜色:
这样,这些按钮的颜色将随着主题的更改而自动更新。