我尝试做的是根据ng-repeat的迭代对象值的某些值有条件地改变td列块中显示的内容。更具体地说,如果您查看下面的代码,我想要做的是基于data.col2val的某些值,我想更改column2中该行显示的内容。
我知道没有ng-if-else这样的东西,但如果有的话,我的代码可能看起来像这样:
<table class="table" id="myTable">
<thead>
<tr>
<th>Column1</th>
<th>Column2</th>
</tr>
</thead>
<tbody ng-repeat="data in dataStore">
<tr>
<td>{{data.col1val}}</td>
<td ng-if="{{data.col2val}}='something'" style="somestyle">something</td>
<td ng-if-else="{{data.col2val}}='somethingelse'" style="someotherstyle">somethingelse</td>
</tr>
</tbody>
</table>
也许有一个微不足道的方法可以做到这一点,但我似乎无法计算/谷歌。我知道如何使用ASP.NET/Razor而不是Angular,所以任何帮助都会受到赞赏并原谅我的无知。
答案 0 :(得分:2)
ng-if="data.col2val=='something'"
你没有在ng-if指令
中使用花括号
var app = angular.module('app', []);
app.controller('firstCtrl', function($scope){
$scope.dataStore = [
{col1val:"Mike", col2val:"something"},
{col1val:"Mike", col2val:"somethingelse"},
];
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<body ng-app="app">
<div ng-controller="firstCtrl">
<table class="table" id="myTable">
<thead>
<tr>
<th>Column1</th>
<th>Column2</th>
</tr>
</thead>
<tbody ng-repeat="data in dataStore">
<tr>
<td>{{data.col1val}}</td>
<td ng-if="data.col2val=='something'" style="somestyle">something</td>
<td ng-if="data.col2val=='somethingelse'" style="someotherstyle">somethingelse</td>
</tr>
</tbody>
</table>
</div>
</body>
&#13;