我尝试使用angularjs在视图页面中隐藏特定值。
为此,我尝试使用ng-show
和ng-hide
,但所有值仍然存在。
HTML
<table ng-table="taskTable" class="ng-table-wrapper table table-striped table-hover">
<tbody>
<tr ng-repeat="obj in $data" ng-click="$state.go('singleTask_view', {'taskId': obj.id})" class="cursor-pointer">
<td>
<span class="label" ng-hide="obj.status == 'Completed'" ng-class="{'label-primary': obj.status == 'In Progress', 'label-danger': obj.status == 'Pending', 'label-success': obj.status == 'Completed'}">{{obj.status}}</span>
<span class="label label-info" ng-if="obj.status == 'In Progress'"></span>
</td>
<td>
<p>
<strong>{{obj.title}}</strong>
</p>
<p>
<small>{{obj.property}}</small>
</p>
</td>
<td class="text-right">
<p>
<i class="fa fa-clock-o"></i> {{obj.date | date: 'dd-MM-yyyy hh:mm'}}
</p>
</td>
</tr>
</tbody>
<tbody ng-if="$data.length==0">
<tr>
<td colspan="5">No tasks found.</td>
</tr>
</tbody>
</table>
我希望在状态为obj.status
status=Completed
的具体值
更多代码供进一步参考:
$scope.taskTable = new ngTableParams(
{
page: 1,
count: 20
},
{
getData: function ($defer, params) {
SingleTaskResourceService.get({
title: $scope.filter.title,
assignee: $scope.filter.assignee,
timeline: $scope.filter.timeline,
startDate: $scope.filter.startDate,
endDate: $scope.filter.endDate,
status: $scope.filter.status,
page: params.page(),
count: params.count()
},
function (data) {
if (data) {
params.total(data.total);
$defer.resolve(data.collection);
}
});
}
}
);
解决:我通过这样做解决了它:
<tr ng-repeat="obj in $data" ng-hide="obj.status == 'Completed'" ng-click="$state.go('singleTask_view', {'taskId': obj.id})" class="cursor-pointer">
<td>
<span class="label" ng-class="{'label-info': obj.status == 'In Progress', 'label-danger': obj.status == 'Pending', 'label-success': obj.status == 'Completed'}">{{obj.status}}</span>
</td> </tr>