Я пытаюсь придумать способ условного форматирования (простой цвет фона) для таблицы html с результатами от контроллера AngularJS. Это, мы надеемся, произойдет во время итераций ng-repeat, поскольку оно работает через элементы в массиве.
То, что я хотел бы сделать, это: всякий раз, когда функция внутри контроллера возвращает true, фон или стиль зеленые, а когда нет, он будет красным.
ПОСМОТРЕТЬ "НАЧАТЬ ВОПРОС" в комментарии для точки ввода.
<!-- PLAYER STATS TABLE -->
<div id = "StatsListTable">
<table border="1" style="width:80%">
<tr> <!-- TODO: class="tr.pstats" -->
<th>Character Name</th>
<th>
<div ng-app="KIdash" ng-controller="controller">
Total Matches: {{TotalMatchesFunc()}} :: {{GreaterWins()}}
</div>
</th>
<th class="green">Wins</th>
<th class="red">Losses</th>
</tr>
<tr ng-repeat="ps in PlayerStats" class = "playerStatTable">
<td>{{ps.name}}</td>
<td>{{ps.matches}}</td>
<!-- BEGIN QUESTION -->
<!-- IF {{GreaterWins()}} make it green -->
<!-- ELSE make it red -->
<script type="text/javascript">
function() {
if( controller.GreaterWins() )
{
<th class="green">{{ps.wins}}</th>
} else {
<th class="red">{{ps.wins}}</th>
}
}
</script>
<!-- END IF -->
<td>{{ps.losses}}</td>
</tr>
<table>
</div>
<!-- END PLAYER STATS TABLE -->
Вы можете сделать это по ng-классу. Что-то вроде ниже:
<tr ng-repeat="ps in PlayerStats" class = "playerStatTable">
<td>{{ps.name}}</td>
<td>{{ps.matches}}</td>
<td ng-class="{'green': GreaterWins(),'red': !GreaterWins() }">{{ps.wins}}</td>
<td>{{ps.losses}}</td>
</tr>
controller.GreaterWins()
потому что вы не используете контроллер в качестве синтаксиса. GreaterWins()
ли GreaterWins()
в области действия controller
? и всегда ли он возвращает false
?