ui-router resolve 在 Ionic 中表现异常答案

【问题标题】：ui-router resolve behaves strangely in Ionicui-router resolve 在 Ionic 中表现异常
【发布时间】：2014-09-16 17:13:56
【问题描述】：

我从一个演示 Ionic 应用程序开始 (ionic start myApp sidemenu)、and added a resolve to one of the views：

resolve: {
  issue: function($q, $timeout) {
    var defer = $q.defer();
    //defer.reject();       // Doesn't work browser or device
    $timeout(defer.reject); // Works in browser, but not device
    return defer.promise;
  }
}

我在这里监控拒绝resolves：

.run(function($ionicPlatform, $rootScope, $ionicLoading) {
  $ionicPlatform.ready(function() {
    // regular stuff here

    $rootScope.$on('$stateChangeError', function() {
      $ionicLoading.show({
        template: 'All good!'
      });
    });
  });
});

由于某种原因，如果resolve 立即拒绝（参见上面的defer.reject()），则不会运行$stateChangeError 的回调。如果我在 Ionic 之外做同样的事情，it works!

此外，尝试通过执行 $timeout(defer.reject); 来延迟 resolve 拒绝会导致不同的行为。现在它可以按预期在浏览器中运行，但仍然无法在设备上运行。尝试延迟更多，结果在设备上成功：

$timeout(function() {
  defer.reject();
}, 250); // Doesn't work for me with 200 or less

有人能解释一下吗？

SEE HERE HOW TO REPRODUCE THE ISSUE

【问题讨论】：

嗨，米莎。我刚刚克隆了你的 Github repo 并运行了命令： ionic run --device android 离子加载模式正确出现。您是在 android 或 ios 设备上尝试这个吗？是否有您正在使用的特定设备？如果你使用模拟器会出现这种情况吗？
发现了一个错误github.com/driftyco/ionic/issues/1751 相应地更新了我的答案
@bhantol 谢谢，这对我有帮助！

标签： angularjs ionic-framework angular-ui-router

【解决方案1】：

根据我对 Angular 和 Promise 模型的经验。为了解决/拒绝一个承诺，Angular 必须在 JS 事件循环的一个周期（nextTick）上打勾，这可以使用 $scope.apply() 来完成，这是我们在单元测试中模拟此类事情的方式。

这是一个很棒的article，它讨论了 $timeout 和 $scope.$evalAsync - 我可以收集到 $timeout 正在评估下一个滴答声中的函数。这就是此代码按照您概述的方式工作的原因。

resolve: {
  issue: function($q, $timeout) {
    var defer = $q.defer();
    //defer.reject();       // <---- no nextTick
    $timeout(defer.reject); // <---- $timeout evaluates on nextTick
    return defer.promise;
  }
}

这是另一个article 讨论 $q 的 textTick 实现。

我知道这并不能解决您的问题 - 但它应该可以解释为什么会发生这种情况！祝你好运！

【讨论】：

【解决方案2】：

1) $timeout 需要大于 200

首先 - 我从未见过像 $timeout(deferred.reject); 这样的结构。我不相信 defered.reject 返回任何 $timeout 期望的函数。

我尝试了 50 并且它有效。这里是http://plnkr.co/edit/6NXZEXrfz3WHVqoaRYJB?p=preview 超时时间为 50 或更少，但可以正常工作，即一切都好！被打印。

resolve: {
              test: function($q,  $timeout) {
                var defer = $q.defer(); 
                $timeout(function(){
                  defer.reject();
                },50);
                return defer.promise; 
              }
}

这是 iconPlatform.ready 之外的 stateChangeError

2) $stateChangeError 不起作用

我认为这与时间安排有关。我不知道 ionicPlatform.ready() 何时执行的内部机制，但我不确定它是否有必要。您的 starter 模块依赖于它，因此它将被加载。有时种子项目不仅有“种子”。

已更新 - 在其他设备上发现有关 ready() 的错误。似乎 ready 方法没有被执行。

https://github.com/driftyco/ionic/issues/1751

【讨论】：