要给出Angular行为主题包含代码示例的解决方法,我们可以按照以下步骤进行:
ng new behavior-theme-example
cd behavior-theme-example
ng generate theme behavior-theme
src/styles.scss
文件,并导入Angular行为主题的样式:@import '~@angular/material/theming';
@import 'theme/behavior-theme';
src/app/app.component.html
文件中添加一个按钮和一个段落元素:
Some text with primary theme color.
src/app/app.component.scss
文件中为段落元素添加行为主题样式:p {
color: mat-color($primary);
}
src/app/app.module.ts
文件中导入MatButtonModule
和MatIconModule
模块:import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
@NgModule({
imports: [
// ...
MatButtonModule,
MatIconModule
],
// ...
})
export class AppModule { }
ng serve
现在,你应该能够在浏览器中看到一个具有Angular行为主题的按钮和一个段落元素,段落元素的文本颜色与主题的主要颜色相匹配。