Hide specific value in view (Angularjs)

103 Views Asked by At

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>
0

There are 0 best solutions below