Angular 8 中 ng-attr-style 的等价物是什么？答案

【问题标题】：What is the equivalent of ng-attr-style in Angular 8?Angular 8 中 ng-attr-style 的等价物是什么？
【发布时间】：2021-10-07 11:38:53
【问题描述】：

我在 AngularJS 中有一个应用程序，我想将其转换为 Angular 8。

在应用程序中，有一个 div，我在其中动态传递宽度，如下所示：

ng-attr-style="width:{{countersDtl.SurveySubmittedInstant/(countersDtl.ServiceDone)*100}}%"

countersDtl 是一个带有 SurveySubmittedInstant 和 ServiceDone 键的对象。

我有多个元素都在使用 ng-attr-style，就像这样。

我尝试了从style.width 到ngStyle 的所有方法，但没有任何效果。

【问题讨论】：

【解决方案1】：

ng-attr-style 的等效项是 ngStyle 绑定。您可以在docs 中阅读有关ngStyle 的更多信息。

您的情况可能正确的语法如下所示：

[ngStyle]="{'width': (countersDtl.SurveySubmittedInstant/(countersDtl.ServiceDone)*100) + '%'"

另外，您可以使用 + '%' 而不是将属性标记为 'width.%'，如下所示：

[ngStyle]="{'width.%': countersDtl.SurveySubmittedInstant/(countersDtl.ServiceDone)*100"

还有第三种可能绑定到width 本身，如下所示：

[style.width.%]="countersDtl.SurveySubmittedInstant/(countersDtl.ServiceDone)*100"

【讨论】：