javascript - Angular 模板中的 Concat 范围

Question

我有三个具有范围变量的文本框是 borderColor(like #000000),borderWidth(like 3px),borderStyle(like solid )。如果这些文本框之一发生更改，我想绑定(bind)一个 div 边框。我正在使用 Angular。这是我到目前为止所做的:

<div ng-style="{'border' : borderWidth+'px'+borderStyle+borderColor}">
This is my firtst div </div>

基本上，这就是我真正想要的:

<div ng-style="{'border' : '3px solid #000000'}">
This is my firtst div </div>

有什么建议吗？

Answer 1

属性之间没有空格，试试:

<div ng-style="{'border' : borderWidth+'px '+borderStyle+' '+borderColor}">

还有一个。您已经描述了“borderWidth(like 3px)”，如果它已经是像 3px 这样的字符串，则不要添加额外的 px。如果它是 3，则添加 px。只是一个防止 3pxpx 的注释。