如何推迟在angularjs指令的方法执行

本文介绍了如何推迟在angularjs指令的方法执行的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述

我正在写一收到函数作为参数指令，该指令执行，并运行任何被包含到函数。

I'm writing a directive which recives a function as a parameter, the directive executes and run whatever is contained into the function.

的使用情况是：

• 指令包含一个链接
• 当用户点击链接的方法作为参数传递（从控制器）被执行
• 当用户打点击按钮，微调将显示
• 微调将隐藏在方法的执行完成

我的问题是我怎么能推迟执行，并将其绑定到一个承诺，隐藏方法执行后的微调。

my question is how can I defer the execution and bind it to a promise, to hide the spinner after the method execution.

为了说明目的，我已经使用的 $超时计数从3到1，请大家看看到code，我迄今所做的：

for illustration purposes I have used $timeout that counts from 3 to 1, please take a look to the code I've done so far:

app.directive('toogleTextLink', function($compile,$q) { return { restrict: 'AE', scope: { callback: "&targetMethod" }, template: '<div><a style="cursor: pointer" ><b>{{text}}</b></a>show value= {{show}} <br/><div ng-class="{previewLoader: show}"></div></div>', link: function (scope, element, attr) { scope.value = attr.value; scope.show = false; scope.$watch('value', function () { if (scope.value) { scope.text = "yes"; } else { scope.text = "no"; } }); element.bind('click', function () { scope.show = true; scope.value = !scope.value; scope.$digest(); if (scope.callback) { var deferred = $q.defer(scope.callback()); deferred.promise.then(function () { scope.show = false; console.log("then called"); }); } }); } }; }); app.controller('myCtrl', function($scope,$timeout,$q) { $scope.IsFacebookConnected = false; $scope.countDown = 3; $scope.authSocial = function(value, socialNetwork) { switch (socialNetwork) { case "facebook": $scope.IsFacebookConnected = !value; } runCounter = function() { $scope.countDown -= 1; if ( $scope.countDown > 0) $timeout(runCounter, 1000); console.log("timer"); }; runCounter(); }; });

这是 plunker 为好。

推荐答案

安迪乔斯林写了承诺跟踪器，这不正是你所需要的。它甚至有一些糖为$ HTTP集成。基本上你添加承诺给它，它会告诉你执行状态。然后，您可以绑定上像一个装载微调动画的执行状态到NG-表演。 github/ajoslin/angular-promise-tracker 这里的演示： plnkr.co/edit/3uAe0NdXLz1lCYlhpaMp?p=$p$pview

Andy Joslin wrote a "promise tracker" which does exactly what you need. It even has some sugar for $http integration. Basically you add "promises" to it, and it tells you the execution state. You can then bind that execution state to ng-show on something like a loading spinner animation. github/ajoslin/angular-promise-tracker and here's a demo: plnkr.co/edit/3uAe0NdXLz1lCYlhpaMp?p=preview

您code看起来是这样的：

Your code will look something like:

$scope.tracker = promiseTracker("socialtracker"); $scope.tracker.addPromise(somePromise);

而在你的看法：

<div ng-show="tracker.active()">Loading...</div>