To toggle a style class in Angular PrimeNG, you can use the [ngClass] directive and the (click) event binding. Here's an example:
HTML Template:
In the above code, we have a button with a click event binding to the "toggleClass()" method. The button also has an [ngClass] directive which binds an object containing the "highlight" class name and a boolean expression "isHighlighted". When isHighlighted is true, the "highlight" class will be applied to the button, and when it is false, the class will be removed.
Component:
export class MyComponent {
isHighlighted: boolean = false;
toggleClass() {
this.isHighlighted = !this.isHighlighted;
}
}
In the component class, we declare the isHighlighted boolean property and initialize it to false. The toggleClass() method simply toggles the value of isHighlighted property, which in turn adds or removes the "highlight" class on the button.
CSS:
.highlight {
background-color: yellow;
}
Finally, we define the CSS class "highlight" with a yellow background-color.
That's it! You can now toggle a style class in Angular PrimeNG using the [ngClass] directive and the (click) event binding. 免责声明:本文内容通过AI工具匹配关键字智能整合而成,仅供参考,火山引擎不对内容的真实、准确或完整作任何形式的承诺。如有任何问题或意见,您可以通过联系service@volcengine.com进行反馈,火山引擎收到您的反馈后将及时答复和处理。