ng-显示条件 table 的记录
ng-Show records of table on condition
我正在尝试显示行及其列值的总和。它具有三个条件成立的状态。
1) 汽车
2) 直播
3) autolive(json 中不存在,需要在行中自动和实时组合)
结论:
在siteData.jobType==toggleValue if (toggleValue==auto)上显示"auto"
的记录
在siteData.jobType==toggleValue(toggleValue==live)上显示"live"
的记录
但是在 siteData.jobType==toggleValue (toggleValue==autolive) 上,它显示没有记录,因为 json
中不存在 autolive
如何实现同时显示汽车和现场的记录?
//自定义切换按钮https://github.com/tannerlinsley/nz-toggle
<nz-toggle
tri-toggle
on-toggle="myFunction()"
ng-model="toggleValue"
val-true="'auto'"
val-false="'live'"
val-null="'autolive'">
</nz-toggle>
<table class="table table-condensed" border ="1" >
<thead>
<tr>
<th>PiteId</th>
<th>PiteId</th>
<th>Type</th>
<th>Date</th>
<th >Success</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="siteData in siteObject" ng-show="siteData.jobType==toggleValue" >
<td>{{siteData.sid}}</td>
<td>{{siteData.PiteId}}</td>
<td>{{siteData.Type}}</td>
<td>{{siteData.Date}}</td>
<td ng-init="siteObject.total.siteData.countSuccess = siteObject.total.siteData.countSuccess + siteData.countSuccess">{{siteData.countSuccess}}</td>
</tr>
</table>
json格式
siteObject =
{
"data": [
{
"sid": 1,
"PiteId": "1~10-4-2017~15:13:40",
"Type": "live",
"Date": "2017-04-14T18:30:00.000Z",
"countSuccess": 1
},
{
"sid": 1,
"PiteId": "1~10-4-2017~15:13:40",
"Type": "auto",
"Date": "2017-04-14T18:30:00.000Z",
"countSuccess": 1
}
]
}
当我切换自动直播时我想要所有这些
试试这个解决方法:ng-show="toggleValue.indexOf(siteData.jobType) > -1"
您需要像这样创建一个自定义过滤器函数:(可以任意命名)
<tr ng-repeat="siteData in siteObject.data | filter: customFilter">
并且,在您的控制器中,您可以为此实现一些自定义逻辑。像这样:
$scope.customFilter = function(obj) {
if($scope.toggleValue !== 'autolive') {
return obj.Type === $scope.toggleValue
}
return true;
}
应该可以!
我正在尝试显示行及其列值的总和。它具有三个条件成立的状态。
1) 汽车 2) 直播 3) autolive(json 中不存在,需要在行中自动和实时组合)
结论:
在siteData.jobType==toggleValue if (toggleValue==auto)上显示"auto"
的记录在siteData.jobType==toggleValue(toggleValue==live)上显示"live"
的记录但是在 siteData.jobType==toggleValue (toggleValue==autolive) 上,它显示没有记录,因为 json
中不存在 autolive如何实现同时显示汽车和现场的记录?
//自定义切换按钮https://github.com/tannerlinsley/nz-toggle
<nz-toggle
tri-toggle
on-toggle="myFunction()"
ng-model="toggleValue"
val-true="'auto'"
val-false="'live'"
val-null="'autolive'">
</nz-toggle>
<table class="table table-condensed" border ="1" >
<thead>
<tr>
<th>PiteId</th>
<th>PiteId</th>
<th>Type</th>
<th>Date</th>
<th >Success</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="siteData in siteObject" ng-show="siteData.jobType==toggleValue" >
<td>{{siteData.sid}}</td>
<td>{{siteData.PiteId}}</td>
<td>{{siteData.Type}}</td>
<td>{{siteData.Date}}</td>
<td ng-init="siteObject.total.siteData.countSuccess = siteObject.total.siteData.countSuccess + siteData.countSuccess">{{siteData.countSuccess}}</td>
</tr>
</table>
json格式
siteObject =
{
"data": [
{
"sid": 1,
"PiteId": "1~10-4-2017~15:13:40",
"Type": "live",
"Date": "2017-04-14T18:30:00.000Z",
"countSuccess": 1
},
{
"sid": 1,
"PiteId": "1~10-4-2017~15:13:40",
"Type": "auto",
"Date": "2017-04-14T18:30:00.000Z",
"countSuccess": 1
}
]
}
当我切换自动直播时我想要所有这些
试试这个解决方法:ng-show="toggleValue.indexOf(siteData.jobType) > -1"
您需要像这样创建一个自定义过滤器函数:(可以任意命名)
<tr ng-repeat="siteData in siteObject.data | filter: customFilter">
并且,在您的控制器中,您可以为此实现一些自定义逻辑。像这样:
$scope.customFilter = function(obj) {
if($scope.toggleValue !== 'autolive') {
return obj.Type === $scope.toggleValue
}
return true;
}
应该可以!