Question

我使用 AngularJS 和 ng-grid 与 RestAngular 来检索数据。由于我的数据是以页面形式返回的，因此网格的设置更加复杂，我决定将其放入指令中。但是，当我从 RestAngular 解析承诺时，结果不会绑定到$scope。

    $scope.gridService.get($scope.pagingOptions.currentPage,
                           $scope.pagingOptions.pageSize).then(function(result){
              $scope.gridData = result;
            });

结果$scope.gridData等于promise解析中的数组，但不在其中。有没有办法将结果绑定到$scope？

我是在Controller中完成的，但同样的模式在这里不起作用。我已在下面列出了完整的指令。

angular.module('viz').directive('grid', function() {
    return {
        restrict: 'E',
        replace: true,
        scope: {
            gridCols: '=',
            gridService: '&'
        },
        template: '<div class="gridStyle" ng-grid="gridOptions"></div>',
        controller: function ($scope, $element, $attrs, $injector) {
            $scope.gridData = [];
            $scope.gridService = $injector.get($attrs.gridservice);

            $scope.pagingOptions = {
                pageSizes: [5, 10, 20],
                pageSize: 20,
                currentPage: 1
            };

            $scope.gridService.get($scope.pagingOptions.currentPage,
                                   $scope.pagingOptions.pageSize).then(function(result){
              $scope.gridData = result;
            });

            $scope.totalServerItems = $scope.gridData.meta.results;
            $scope.pagingOptions.currentPage = $scope.gridData.meta.page;

            $scope.gridOptions = {
                data: 'gridData',
                selectedItems: $scope.mySelections,
                multiSelect: false,
                enableHighlighting: true,
                enableRowSelection: true,
                enablePaging: true,
                showFooter: true,
                pagingOptions: $scope.pagingOptions,
                totalServerItems: 'totalServerItems',
                columnDefs: $scope.gridCols
            };

        },
        link: function(scope, element, attrs, fn) {

            scope.$watch('pagingOptions', function (newVal, oldVal) {
                if (newVal !== oldVal && newVal.currentPage !== oldVal.currentPage) {
                    scope.gridData = scope.gridService.get(
                        scope.pagingOptions.currentPage,
                        scope.pagingOptions.pageSize
                    );
                }
            }, true);

        }
    };
});

Answer 1

我发现了问题。我需要在then函数中移动两个变量赋值。我相信这导致了解决的承诺，但我不确定。

$scope.gridService.get($scope.pagingOptions.currentPage,
                       $scope.pagingOptions.pageSize).then(function(result){
     $scope.gridData = result;
     $scope.totalServerItems = $scope.gridData.meta.results;
     $scope.pagingOptions.currentPage = $scope.gridData.meta.page;
});

AngularJS的范围承诺解决

1 个答案: