如何为PrimeNG p-inputSwitch设置onLabel和offLabel开关文本
p-inputSwitch 配置开关状态文本的实现方法
PrimeNG 官方原生提供了对应配置项,无需自定义改造组件即可实现开启/关闭状态的自定义文本显示:
- 开启(On)状态文本通过
onLabel输入属性配置 - 关闭(Off)状态文本通过
offLabel输入属性配置
你原有代码存在一处小问题:onChange事件绑定多写了一个闭合右括号,会触发Angular模板语法报错,修正时一并处理即可。
添加对应配置后的完整代码如下:
<p-inputSwitch [(ngModel)]="checked" name="first-chk" onLabel="Yes" offLabel="No" (onChange)="myFunction()"> </p-inputSwitch>
注意:
onLabel和offLabel是InputSwitch组件的公开稳定API,v7及之后的所有PrimeNG正式版本均支持。如果配置后文本未正常展示,优先检查项目全局样式是否覆盖了组件默认的文本节点样式。
内容的提问来源于stack exchange,提问作者Aneesh Ajithkumar
相关产品推荐
相关产品推荐

