AngularJS :使用 "resolve" 将承诺注入控制器

AngularJS : Injecting a promise into a controller using "resolve"

我正在尝试实例化一个控制器,使用 "resolve" 对象传递参数。 语法如下:

{
  controller: 'HtmlModalController',
  resolve: {
    myarg: function() {
      return "FOO";
    }
  }
}

这将导致我的控制器将“myarg”变量作为参数注入,其值为 "FOO"。

现在,这个语法也支持promises,在实例化controller的时候会自动解析。

  resolve: {
    myarg: function() {
      // Does the same as above (auto-resolved promise)
      return $q.when("FOO");
    }
  }

现在,问题是:如何将承诺注入控制器?我不希望承诺得到解决,因为我会在加载控制器后解决它。 我试图嵌套多个承诺,但它们都在控制器中一次解析回 "FOO" 值。

  resolve: {
    myarg: function() {
      // All promises are resolved for me :'(
      return $q.when($q.when("FOO"));
    }
  }

我目前唯一的解决方案是将承诺包装成 function/object :

  resolve: {
    myarg: function() {
      // So in my controller I can do "myarg.promise.then(...)"
      return {promise: $q.when("FOO")};
    }
  }

我知道这是一个非阻塞细节,但我想知道是否有一种方法可以正确解决承诺 "as a promise"。

谢谢=)

如果 promise 不被隐式递归地解包为最终值,就无法解决它。使用承诺解决将始终解决承诺的结果而不是承诺本身。

唯一的选择是像使用 {p: promise } 而不是 then 方法一样传递包装器。

您可以使用的一种模式是提供承诺并在内部缓存它的服务。

function MyService() {
    var promise;
    this.getSomePromise = function() {
        if(!promise) {
            promise = $q.when(...); // whatever produces your promise
        }
        return promise;
    }
}

myModule.service('myService', MyService);

然后您可以在控制器中依赖此服务:

myModule.controller('MyController', function(myService) {
    myService.getSomePromise().then(result => ...);
});

以及用它来阻止你的决心:

resolve: {
    /** 
      * Note: we are not actually injecting this. 
      * Only using it to block the route. The name blocker is arbitrary and could be anything.
      */
    blocker: function(myService) {
        return myService.getSomePromise();
    }
}

这允许您将任意数量的 then 处理程序连接到服务方法,同时确保仅调用 1 个底层异步操作和 1 个 promise 实例。