在Angular中,可以使用条件语句来动态切换模板类。以下是一个简单的代码示例:
import { Component } from '@angular/core';
@Component({
selector: 'app-example',
template: `
This is some content.
`,
styleUrls: ['./example.component.css']
})
export class ExampleComponent {
isClass1: boolean = true;
toggleClass() {
this.isClass1 = !this.isClass1;
}
}
在组件的模板中使用[ngClass]
指令,根据变量isClass1
的值来动态切换模板类。在上面的示例中,当isClass1
为true
时,应用class1
类;当isClass1
为false
时,应用class2
类。
在组件的模板中,使用一个按钮来调用toggleClass()
方法,以实现切换模板类的功能。
在组件的CSS文件中,定义class1
和class2
类的样式。
通过以上步骤,当点击按钮时,模板类将根据isClass1
变量的值进行动态切换。