Question

当值{{reservoir}}大于100时，如果小于100显示图标，则显示值。

 <div class="water-box-label text-center" ng-if="reservoir>100"> 
    <div>
        <i class="fa fa-exclamation-triangle"></i>
    </div>
    {{reservoir}}
    <h5>
        <p>{{reservoir_value}} m&sup3</p>
    </h5>
 </div>

控制器

 $scope.reservoir = $scope.updateWaterLevel(value, "watertank");
 $scope.reservoir_value = ($scope.reservoir.split("%")[0]*1000)/100;
 $scope.updateWaterLevel = function (value, elementID) {
    var waterBox = document.getElementById(elementID);
    waterBox.style.height = value.INFO + '%';
    if (value.INFO < 15) {
        waterBox.style.background = '#c0392b';
    }else if(value.INFO > 100){
        waterBox.style.height = 0;
    } else {
        waterBox.style.background = '#3498db';
    }
    return value.INFO + ' %';
};

Answer 1

首先，$scope.updateWaterLevel在分配之前被调用。如果要将其保留在控制器的底部，请将其更改为一个函数声明，该函数声明将被提升并可以从控制器顶部调用。

$scope.updateWaterLevel = updateWaterLevel;
...
function updateWaterLevel(value, elementID) {
    ...
}

其次，ng-if将数字100与初始化为reservoir的字符串value.INFO + ' %'进行比较。尝试将reservoir作为一个数字，然后添加＆＃39;％＆＃39;在视图中。

超过100％时显示符号

1 个答案: