Question

ng-class="{highlightRow: row.Note === 'Success'}"

如果这突出显示注意字段成功的行，我是否可以在此ng-class中包含条件以突出显示注意字段是成功还是警告？

Answer 1

您可以拥有ng-class="{highlightRow: (value === 'Success' || value ==='Warning')

我默认提供success，3秒后更改为Warning，但highlightRow保持不变。 请检查以下摘录和演示

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<body>
<style>
.highlightRow{
color: green
}
</style>
<div ng-app="myApp" ng-controller="myCtrl">

<p ng-class="{highlightRow: value === 'Success' || value ==='Warning'}">{{value}}</p>

</div>

<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope, $timeout) {
    $scope.value = "Success";
     $timeout( function(){
            $scope.value = "Warning";
        }, 3000 );
});
</script>

</body>
</html>

请运行以上代码

Here is a working DEMO

Answer 2

你试过这个吗？

ng-class= "{'highlightRow' : row.Note === 'Success' || row.Note === 'Warning'}"

Angularjs - 'ng-class'中的条件

2 个答案: