javascript – 如何从异步调用中填充ng表上的选择过滤器

如何使用ajax / json填充ng表,包括“选择”过滤器？

Plunk showing the problem: http://plnkr.co/Zn09LV

详情

我正在努力掌握AngualrJS和ng表扩展,尽管我可以使用工作过滤器获取一些漂亮的表,当我使用javascript中定义的静态数据时,一旦我尝试将实际数据加载到桌子我打了一个钩子.

ng表的主体正确填充,只要我只使用文本过滤器,一切似乎都在工作：

<td data-title="'Name'" filter="{ 'Name': 'text' }" sortable="'Name'">
            {{user.Name}}
        </td>

工作很好

但是,如果我更新此选项以使用选择过滤器：

<td data-title="'Name'" filter="{ 'Name': 'select' }" sortable="'Name'"  filter-data="Names($column)">
            {{user.Name}}
        </td>

我遇到了一个syncronisation问题,因为在变量从服务器返回数据之前总是被评估. (可能在对服务器的请求发送之前,可以评估Names varibale).这意味着我得到一个空列表.

一旦数据从服务器返回 – 我似乎找不到更新选择过滤器的方法.重新运行创建过滤器列表的代码最初似乎没有效果 – 我不知道如何触发ng表重新检查其过滤器,以便更新的变量不被读取.
我也无法想出推迟变量评估的方法,直到异步调用完成.

对于我的javascript,我几乎使用了ng表格GitHub页面中的示例ajax代码,并将其添加到选择过滤器的示例代码.

$scope.tableParams = new ngTableParams({
        page: 1,// show first page
        count: 10,// count per page
        sorting: {
            name: 'asc'     // initial sorting
        }
    },{
        total: 0,// length of data
        getData: function($defer,params) {
            // ajax request to api
            Api.get(params.url(),function(data) {
                $timeout(function() {
                    // update table params
                    var orderedData = params.sorting ?
                    $filter('orderBy')(data.result,params.orderBy()) :
                    data.result;
                    orderedData = params.filter ?
                    $filter('filter')(orderedData,params.filter()) :
                    orderedData;

                    $scope.users = orderedData.slice((params.page() - 1) * params.count(),params.page() * params.count());

                    params.total(orderedData.length); // set total for recalc pagination
                    $defer.resolve($scope.users);
                },500);
            });
        }
    });

    var inArray = Array.prototype.indexOf ?
    function (val,arr) {
        return arr.indexOf(val)
    } :
    function (val,arr) {
        var i = arr.length;
        while (i--) {
            if (arr[i] === val) return i;
        }
        return -1
    };
$scope.names = function(column) {
    var def = $q.defer(),arr = [],names = [];
    angular.forEach(data,function(item){
        if (inArray(item.name,arr) === -1) {
            arr.push(item.name);
            names.push({
                'id': item.name,'title': item.name
            });
        }
    });
    def.resolve(names);
    return def;
};

我尝试了一些额外的$q.defer()和尝试添加$scope.names函数的初始数据,但我对promise和延迟的理解不够强大,无法使任何工作.

有几个关于GitHub的注释表明这是ng表中的一个bug,但我不知道是否是这种情况,或者我只是在做某事.

https://github.com/esvit/ng-table/issues/186

指针如何程序非常感激

-Kaine-