html - 具有多个条件表达式和多个样式属性的 Angular ng-style

Question

我想使用 ng-style 为 Accordion 组添加多个样式属性，条件是 ng-class 不适用于 Accordion 。

这是我正在尝试的方式:

ng-style="{ border: ivrMessageForm.ivr_messagetitle.$error.required && !isFormValid ? '2px solid' : 'none' }"

这工作正常。但也想添加 border-color。

我试过这个:

ng-style="{ border: ivrMessageForm.ivr_messagetitle.$error.required && !isFormValid ? '2px solid' : 'none', border-color: ivrMessageForm.ivr_messagetitle.$error.required && !isFormValid  ? 'red' : 'none'}"

但它给我解析错误。

我也试过这个但是同样的解析错误:

ng-style="ivrMessageForm.ivr_messagetitle.$error.required ? {border:'3px solid', border-color: 'red'} : {border:'none', border-color: 'none'}"

任何人都可以帮助我如何使用 ng-style 添加具有多个条件的多个样式属性。

Answer 1

你应该给 'border-color' 添加单引号

ng-style="{ border: ivrMessageForm.ivr_messagetitle.$error.required && !isFormValid ? '2px solid' : 'none', 'border-color': ivrMessageForm.ivr_messagetitle.$error.required && !isFormValid  ? 'red' : 'none'}"