AngularJS Promise不会检索深度包装的jQuery $ .post调用

Question

我正在开发一个JavaScript库和AngularJS前端。 JavaScript库需要具有可移植性，因此它不能依赖AngularJS。 我们使用一个非常标准的servlet查询模式：

queryService = function(url, method, params, resultHandler, queryId)
{
  var request = {
    jsonrpc: "2.0",
    id: queryId || "no_id",
    method: method,
    params: params
   };
  $.post(url, JSON.stringify(request), handleResponse, "json");

  function handleResponse(response)
  {
    if (response.error)
        console.log(JSON.stringify(response, null, 3));
    else if (resultHandler)
        resultHandler(response.result, queryId);
   }
};

此queryService函数由库中的其他函数调用。 您可以看到queryService返回任何内容。 它期望回调函数执行所有需要的操作。 我不知道需要什么回调函数才能将结果返回到Promise对象的then()函数。 这是Angular服务代码：

angular.module("app").service("Data", function($q){
return {
  getColNamesFromDb: function(table, scope){
    var deferred = $q.defer();

    var callbackFcn = function(result){
      console.log(result); // This successfully logs the result to the console!
      deferred.resolve(result); // also tried deferred.resolve();
    };

    var safeApply = function(scope, fn) {
      (scope.$$phase || scope.$root.$$phase) ? fn() : scope.$apply(fn);
    };
    safeApply(scope, function(){
      deferred.resolve(queryWrapperForColNames(scope.tableName, callbackfcn));
      // also tried $q.when(queryWrapperForColNames(scope.tableName, callbackfcn)); 
    });

    return deferred.promise;
  }};
});

从我的控制器中，我调用Data.getColNamesFromDb()并获得一个Promise对象。 但是，无论我尝试什么，都无法获取then()函数来查看从数据库返回的内容。 这是控制器：

angular.module("app").controller("Ctrl", function($scope, Data)
{
    $scope.options;

    var promise = Data.getColNamesFromDb("table1", $scope);

    promise.then(function(result){
        $scope.options = result;
    },function(result){
        console.log("error " + result);
    });
})

我知道我对诺言如何运作缺少一种愚蠢的想法，但我看不到什么。 从我在代码中评论的一些“选项”应该可以清楚地看出，我只是在尝试随机方法并用手指交叉。

Answer 1

首先尝试修复此调用：

var promise = Data.getColNamesFromDb("table1", $scope);

根据您的示例，该方法定义为将$ scope作为第一个参数，而不是第二个参数，因此您的safeApply函数实际上不会导致$ digest循环发生，因为该字符串没有$$ phase属性。

编辑

现在示例已更正，请尝试以下操作：

angular.module( "app" ).service( "Data", function( $q ) {
    return {
        getColNamesFromDb: function( table, scope ) {
            var deferred = $q.defer();

            function safeApply( fn ) {
                if ( !scope.$$phase ) {
                    scope.$apply( fn );
                }
                else {
                    fn();
                }
            }

            queryWrapperForColNames( scope.tableName, function( result ) {
                safeApply(function() {
                    console.log( result );
                    deferred.resolve( result );
                });
            });

            return deferred.promise;
        }
    };
});

在原始示例中，您要解决两次延期问题； 一次在safeApply调用中，一次在您的回调函数中。 延迟只能解析一次（进一步的调用无效），因此可以使用safeApply中传递给它的值来解析延迟。 由于queryWrapperFor最有可能隐式返回undefined（我在这里看不到定义），因此，您的延期将使用undefined解决。