根据评级 ng-style Angular 更改宽度

Question

我正在尝试根据评级更改此跨度的宽度。 'quality' 在这种情况下是从 1 到 5。如果等级是 5，宽度应该是 100%。我如何将它与 ng-style 绑定？

<span class="rating-box" ng-style="{ 'width': {{star.quality*20}} + '%' }"></span>

此代码无效。我收到此错误：

Template parse errors:
Can't bind to 'ng-style' since it isn't a known property of 'span'. ("      <small>Calitate</small>

非常感谢！

Answer 1

正确的语法是：
<span class="rating-box" [ngStyle]="{ 'width': star.quality*20 + '%' }"></span>

您可以在官方文档中找到该指令的选择器定义：https://angular.io/api/common/NgStyle

Answer 2

这是 angular 的语法错误 8 你需要使用

<span class="rating-box" [ngStyle]="{ 'width': star.quality*20 + '%' }"></span>

Changing the width according to the rating ng-style Angular