I try to hide a specific value in my view page using angularjs.
For that i tried using the ng-show and ng-hide but all values are still there.
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>
I want to hide specific value of obj.status when status is status=Completed
More code for further reference:
$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);
}
});
}
}
);
Solved: I solved it by doing it this way:
<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>