Question

我想在损益情况下给班级打电话，所以我使用了大于和小于标志。大于工作正常但小于符号会导致解析错误。

这是我的代码： -

<td [ngClass]="{'text-green': profitLoss.netSaving > 0},{'text-red': profitLoss.netSaving < 0}">{{profitLoss.netSaving}}</td>

Answer 1

Angular JS在ng-class Directive中提供此功能。您可以在其中放置条件并分配条件类。

使用此

<td ng-class="{true: 'text-green', false: 'text-red'}[ profitLoss.netSaving > 0]">{{profitLoss.netSaving}}</td>

Answer 2

请查看此内容并尝试更改“a”的值。

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<style>
.text-red{
color:red;
font-size:35px;
}
.text-green{
color:blue;
font-size:25px;
}
</style>
<body>

<div ng-app="myApp" ng-controller="abc">
<p ng-class="{'text-green': a > 0,'text-red': a < 0}">Have a look at me. Am I able to help you?</p>
</div>

<script>
var app = angular.module('myApp', []);
app.controller('abc', function($scope) {
    $scope.a = -1;
});
</script>

</body>
</html>

Answer 3

<和>符号用于打开和关闭html元素。因此，请使用<和>，如下所示：

<td [ngClass]="{'text-green': profitLoss.netSaving &gt; 0, 'text-red': profitLoss.netSaving &lt; 0}">{{profitLoss.netSaving}}</td>

检查HTML中的条件

3 个答案: