Question

我试图将承诺链接到我的超时/打字机效果＆＃39;函数，所以一旦函数完成，应该调用另一个函数，这是一个简单的$ state.go。我一直在研究和查看这么多帖子，但无论我尝试什么都不起作用 - 第一个函数永远不会被执行/或者可能被执行但是如此之快以至于你无法看到任何东西 - 而只是第二个（$ state.go）函数是正在被执行。任何想法都将非常感激。谢谢！

app.controller('homeCtrl', function($scope, $state, $q, $interval, $timeout) {
     function beginn() {
        var content = "helloo"
        $scope.typewriter = "";
        var i = 0;
        var timer = $interval(function() {
            if (i < content.length)
                $scope.typewriter += content[i];
            else {
                $interval.cancel(timer);
            }
            i++;

        }, 300)
    }

    function change() {
        $state.go('profile')
    }

    $q.when(beginn()).then(change);

});

HTML：

<p>{{typewriter}}</p>

Answer 1

但为什么你需要将这两个承诺联系在一起？所有你需要做的就是在完成角色推进时做$state.go。

.controller('demoCtrl', ['$scope', '$state', '$interval', function($scope, $state, $interval) {
  var content = "helloo"
  $scope.typewriter = "";
  var i = 0;
  var timer = $interval(function() {
    if (i < content.length) {
      $scope.typewriter += content[i];
    } else {
      $state.go('home') // just go to the state directly
    }
    i++;
  }, 300)
}])

工作plnkr here

修改

如果你想以你的（功能性）方式做，你需要创建一个延期的承诺，然后在完成推送信件时解决/拒绝它。

function begin() { var deferred= $q.defer();//create a deferred object using $q var content = "helloo"; $scope.typewriter = ""; var i = 0; var timer = $interval(function() { if (i < content.length) { $scope.typewriter += content[i]; } else { deferred.resolve(); //resolve this when done } i++; }, 300); return deferred.promise; // return the promise of the deferred object } begin().then(()=>$state.go('home')) // call it as usual, but using .then

工作plnkr here

Answer 2

为什么你的代码不起作用很简单，List IP request port 80: List IP request port 443: List IP request ESTA: 123.x.x.x 183.x.x.x 153.x.x.x 193.x.x.x 123.x.x.x 164.x.x.x 130.x.x.x 103.x.x.x 101.x.x.x 187.x.x.x 173.x.x.x 185.x.x.x函数在beginn中调用它时会立即返回when（undefined回调之前有机会被执行。由于您要向$interval（$q.when返回的undefined）提供同步值，因此承诺将立即得到解决，因此beginn()块中的change功能将在您提供给then的回调之前立即致电。

如果您仍然认为您想使用promise api，那么您应该如何编写代码：

$interval

}）;

看看app.controller('homeCtrl', function($scope, $state, $q, $interval, $timeout) { function beginn() { var content = "helloo" $scope.typewriter = ""; var i = 0; return $q(function(resolve, reject) { var timer = $interval(function() { if (i < content.length) $scope.typewriter += content[i]; else { $interval.cancel(timer); resolve(); } i++; }, 300); }); } function change() { $state.go('profile') } beginn().then(change);现在如何立即返回一个承诺，但只在作业完成时重新解析它，我们想要取消定时器。另请注意，您不再需要使用beginn()。

Answer 3

我认为您没有看到任何内容，因为范围内的变量范围松散，您需要让范围知道您使用$ scope进行了更改。$ apply。

所以你的代码应该是这样的。

       var timer = $interval(function() {
            if (i < content.length){
                $scope.typewriter += content[i];
                $scope.$apply();
            else {
                $interval.cancel(timer);
            }
            i++;

        }, 300)

Angular - 如何将promise（$ state.go函数）链接到超时函数？

3 个答案: