"Не удается найти другой объект поддержки", когда я использую ngstyle

У меня есть индикатор выполнения

<div class="progress-bar-line red" role="progressbar"  
    aria-valuenow="redrated" aria-valuemin="0" aria-valuemax="100"
    ngStyle="max-width:{{redrated}}%"
>
    <span class="title">{{ redrated }}%</span>
</div>

я использовал ngStyle="max-width:{{redrated}}%" и попробовал попытки:

  1. Сделали объект в компоненте и назвали его в стиле нг
  2. Четное ngStyle="{'max-width': '20px' }" также дает ту же ошибку, пожалуйста, помогите мне решить эту проблему

2 ответа

    <!DOCTYPE html>
    <html>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
    <body>
    <div ng-app="myApp" ng-controller="myCtrl">    
    <div class="progress-bar-line red" role="progressbar"  
                aria-valuenow="redrated" aria-valuemin="0" aria-valuemax="100"
                ng-style="{'max-width': '{{redrated}}%'}">
                <span class="title">{{ redrated }}%</span>
            </div>
    </div>
    
    <script>
    var app = angular.module('myApp', []);
    app.controller('myCtrl', function($scope) {
        $scope.redrated = 20;
    });
    </script>
    </body>
    </html>

Правильный синтаксис — определять пиксели в ключе, а не в значении:

      <div [ngStyle]="{'min-height.px':'700'}">
</div>

См. https://angular.io/api/common/NgStyle .

Другие вопросы по тегам