【问题标题】:filtering model on client angularjs客户端angularjs上的过滤模型
【发布时间】:2015-09-28 08:18:38
【问题描述】:

我有这样的模型:

{
    "TaskDate": "2015-01-04T00:00:00",
    "TimesheetList": [
        {
            "WorkItemId":24,
            "ProjectId":3,
            "ProjectName":"Hello world",
            "UserId":12,
            "UserName":"Anatoliy Svetliakov",
            "Date":"2015-01-04T22:00:00",
            "Task":"#34 : New task test",
            "TimeWorked":2,
            "Note":null,
            "InProgress":false
        }
    ]
}

此数据显示在无限滚动的表格中。我需要创建自定义过滤器,它将按Name 和/或Data(from-to) 过滤数据。请给我一个想法如何做到这一点。我已经创建了函数,但它不起作用。

.filter('tsFilter', function() {
                return function(model, filter) {
                    var filtered = [];
                    if (model != null) {
                        for (var i = 0; i < model.length; i++) {
                            filtered[i] = model[i];
                        }
                    }

                    if (filter != null) {
                        if (filter.UserId != null) {
                            for (i = 0; i < filtered.length; i++) {
                                for (var j = 0; j < filtered[i]['List'].length; j++) {
                                    if (filtered[i].List[j].UserId != filter.UserId) {
                                        filtered.splice(j, 1);
                                        j--;
                                    }
                                }
                            }
                        }
                    }

                    for (i = 0; i < filtered.length; i++) {
                        if (filtered[i].List.length == 0) {
                            filtered.splice(i, 1);
                            i--;
                        }
                    }
                    return filtered;
                };
            })

页表显示为:

<div class="timesheet-table-container">
    <table class="table-timesheet" id="table-body" infinite-scroll-immediate-check="false" infinite-scroll="loadMore()" infinite-scroll-distance="1">
        <tbody ng-repeat="item in model | tsFilter: filter | limitTo: limits track by $index">
            <tr class="timesheet-day-block">
                <td colspan="6">
                    <span class="timesheet-date">{{item.TaskDate | dateFilter}}</span>
                </td>
            </tr>

            <tr class="timesheet-table-rows" ng-repeat="list in item.List" ng-form="logged">
                <td>{{list.ProjectName}}</td>
                <td>{{list.UserName}}</td>
                <td>{{list.Date | date: 'dd/MM/yyyy'}}</td>
                <td>{{list.Task}}</td>
                <td>{{list.TimeWorked}}</td>
                <td>
                    <span style="width: 85%">{{list.Note}}</span>
                    <button class="active-delete-button" ng-click="removeTask(list)" style="display: inline-block; float:right">вњ–</button>
                </td>
            </tr>
        </tbody>
    </table>
</div>

【问题讨论】:

  • 不是答案.. 但是如果您通过传递过滤器参数而不是在客户端上过滤服务器上的数据,那么性能会更好

标签: html angularjs angularjs-filter


【解决方案1】:

【讨论】:

  • 这很好,但它仅适用于按用户 ID 或日期过滤。我需要按 UserId OR Date 和 UserId AND Date 过滤
  • @HUSTLIN:我已经更新了,抱歉我的错……现在试试,让我知道。
  • 是的,它有效,谢谢!) davilmaycode 服务是什么?
  • @HUSTLIN davilmaycode.it 是我的网页设计工作室 ;-) 由于时间不够,网站正在建设中 =))) 如果您对某些项目感兴趣,请联系。
猜你喜欢
  • 1970-01-01
  • 2014-09-18
  • 1970-01-01
  • 2012-10-15
  • 2012-12-21
  • 2010-12-21
  • 2013-04-13
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多