隐藏视图中的特定值(Angularjs)

时间:2018-01-25 07:23:05

标签: javascript angularjs html5 ng-hide

我尝试使用angularjs在视图页面中隐藏特定值。

为此,我尝试使用ng-showng-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>

0 个答案:

没有答案