Angular ngStyle-绑定动态和静态CSS属性

Question

我正在尝试将样式合并到一个[ngStyle]绑定中，但是不断出现模板错误。

这是工作版本，分开的样式：

 <i [ngStyle]="{'background-color':getColorInitials(dataItem)}" 
                        style= "display: inline-flex; 
                                height: 30px; 
                                width: 30px;
                                border-radius: 50%;
                                border: white; 
                                border-style: solid; 
                                border-width: 1px;" >

但是，这会引发模板错误。能做到吗？

    <i [ngStyle]="{ 'background-color':getColorInitials(dataItem),
                                    'display': 'inline-flex',
                                    'height': '30px',
                                    'width': '30px',
                                    'border-radius': '50%'',
                                    'border': 'white',
                                    'border-style': 'solid',
                                    'border-width': '1px' }" >

谢谢

Answer 1

使用borderRadius代替border-radius，其他连字样式也一样。