Question

我不确定是什么问题，但似乎在我的$ scope定义之前初始化了datatables指令。更重要的是，似乎变量设置了两次。

我有userService从我的服务器检索列定义和数据。 getUserList()方法返回一个promise。我使用then（）方法设置将由datatables指令使用的$ scope变量。似乎该指令在请求完成之前请求变量。此外，似乎变量设置了两次，因为在Chrome的开发控制台中，我看到两次“测试”日志。

如果我使用静态数据（不是来自服务器）并将$ scope变量放在getUserList()承诺之外，它可以正常工作。

    $scope.indexList = function () {
                userService.getUserList().then(function (data) {


                    $scope.dtOptions = DTOptionsBuilder.fromFnPromise(function () {
                        console.log("test"); 
                        var deferred = $q.defer();
                        deferred.resolve(data.Data);
                        return deferred.promise;
                    });
                    $scope.dtColumns = [];

                    angular.forEach(data.DataTablesColumns, function (i, v) {
                        $scope.dtColumns.push(DTColumnBuilder.newColumn(i.Id)
                                              .withTitle(i.DisplayName)
                                              .renderWith(actionsHtml));
                    });

                });
            }

这就是我设置datatables指令的方法：

    <div ng-init="indexList()">
        <table datatable="" dt-options="dtOptions" dt-columns="dtColumns"class="row-border hover"></table>
    </div>

Answer 1

指令代码在页面加载后立即执行。由于您的$ scope变量是在promise中定义的，因此在页面加载时它们不可用。

该指令不等待请求完成，因为请求本质上是异步的。如果您希望在请求完成时更新指令变量，则必须在链接函数的$ scope.variables中设置$watch（或$ watchGroup，如果要查看多个变量），如下所示：

link: function(scope, element, attrs) {
    scope.$watch('dtOptions', function(newval, oldval) {
        //your directive code involving scope variables here.
    })
}

Answer 2

似乎我必须拨打2个电话到我的服务器才能完成我的工作。这有效，但我觉得应该有一种方法可以对服务器进行一次调用，然后返回整个结果。经过一些阅读后，选项和列构建器可以做出承诺。

$scope.indexList = function () {


            $scope.dtOptions = DTOptionsBuilder.fromFnPromise(function () {
                return userService.getUserList(ngRequestGlobabls.context.organization).then(function(data) {
                    return data.Data;
                });
            });


            $scope.dtColumns = userService.getUserList(ngRequestGlobabls.context.organization).then(function (data) {
                columns = [];
                angular.forEach(data.DataTablesColumns, function(i, v) {
                    columns.push(DTColumnBuilder.newColumn(i.Id).withTitle(i.DisplayName).renderWith(actionsHtml));
                });

                return columns;
            });

在promise数据表指令的promise方法中分配$ scope变量？

2 个答案: