Heim >Web-Frontend >js-Tutorial >Was sind Dienste in AngularJS? Einführung in die Verwendung von AngularJS
In diesem Artikel werden hauptsächlich die Dienste in AngularJS sowie die Details der Abhängigkeiten in AngularJS vorgestellt. Werfen wir jetzt einen Blick auf diesen Artikel
Anmerkung des Übersetzers: Ich habe einen sehr guten Artikel gesehen, wenn Sie interessiert sind, können Sie dies tun Schauen Sie sich „Promises und Javascript Asynchronous Programming“ an, in dem die Spezifikationen und Verwendungsszenarien von Promises behandelt werden. Die Vorteile werden sehr ausführlich erklärt und ich persönlich finde es einfach und leicht zu verstehen.
Da es zur Verarbeitung asynchroner Programmierung verwendet wird, gibt es in browserseitigem JS zwei Haupttypen: setTimeout- und Ajax-Anfragen. Die Verwendung von Versprechen ist den Erfolgs- und Fehlerrückrufen von Ajax-Anfragen sehr ähnlich.
Diese versprochene/aufgeschobene Implementierung ist von Kris Kowals Q CommonJS Promise-Empfehlungsdokument inspiriert und behandelt Versprechen als Schnittstelle für die Interaktion mit asynchron ausgeführten Aktionsergebnisobjekten in der angegebenen Zeit. Sie kann innerhalb der angegebenen Zeit abgeschlossen werden oder auch nicht ( (z. B. Zeitüberschreitung, Fehler, Abfangen usw.).
Aus Sicht der Fehlerbehandlung sind die APIs „delay“ (deferred ) und „Promise“ (promise ) für die asynchrone Programmierung und vorgesehen try, catch und throw bewirken im Großen und Ganzen das Gleiche
// 为了演示的目的,此处我们假设 `$q`, `scope` 以及 `okToGreet` 引用 在当前执行环境中可用 // (比如他们已经被注入,或者被当做参数传进来了). function asyncGreet(name) { var deferred = $q.defer(); setTimeout(function() { // 因为此function 在未来的事件循环中异步执行, // 我们需要把代码包装到到一个 $apply 调用中,以便正确的观察到 model 的改变 scope.$apply(function() { deferred.notify('即将问候 ' + name + '.'); if (okToGreet(name)) { deferred.resolve('你好, ' + name + '!'); } else { deferred.reject('拒绝问候 ' + name + ' .'); } }); }, 1000); return deferred.promise; } var promise = asyncGreet('小漠漠'); promise.then(function(greeting) { alert('成功: ' + greeting); }, function(reason) { alert('失败鸟: ' + reason); }, function(update) { alert('收到通知: ' + update); });Der Effekt der Einführung dieser zusätzlichen Komplexität ist möglicherweise zunächst nicht offensichtlich . Die Vorteile lassen sich erkennen, wenn man Versprechen mit Promise- und Deferred-APIs macht, siehe: https://github.com/kriskowal/uncommonjs/blob/master/promises/pecification.md
Darüber hinaus ermöglicht die Promise-API diese Bei herkömmlichen Callbacks (CPS) ist die Kombination eine schwer zu erreichende Methode. Weitere Informationen finden Sie in der
Q-Dokumentation, insbesondere im Abschnitt zum Zusammenführen von seriell und parallel.
Das verzögerte Objekt wird verwendet, um die Promise-Instanz mit der API zu verknüpfen, die den Aufgabenstatus markiert (erfolgreiche oder fehlgeschlagene Ausführung).
resolve(value) ——Wert übergeben, um das abgeleitete Versprechen aufzulösen. Wenn value ein über $q.reject erstelltes Ablehnungsobjekt (rejection) ist, wird das Versprechen abgelehnt.
ablehnen (Grund) – Lehnen Sie das abgeleitete Versprechen ab und geben Sie den Grund an. Dies entspricht der Übergabe des über $q.reject erstellten Ablehnungsobjekts (rejection) als aufzulösenden Parameter.
notify(value) – Stellt Statusaktualisierungen während der Versprechensausführung bereit. Dies kann mehrmals aufgerufen werden, bevor das Versprechen gelöst oder abgelehnt wird.
Versprechen – {Versprechen} —— Versprechen im Zusammenhang mit verzögerten Objekten.
deferred.promise abgerufen werden . Der Zweck des Versprechensobjekts besteht darin, dem interessierten Teil zu ermöglichen, seine Ausführungsergebnisse zu erhalten, wenn die verzögerte Aufgabe abgeschlossen ist.
promiseB = promiseA.then(function(result) { return result + 1; }); // promiseB 将会在处理完 promiseA 之后立刻被处理, // 并且其 value值是promiseA的结果增加1
我们可以创建任意长度的promise链;因为一个promise可以被另一个promises处理(进一步推迟解决完成时间),所以在promise链上的任意一点进行 暂停/推迟解决 都是可行的。 这使得实现功能强大的APIs 成为现实,例如 $http 的响应拦截器。
主要区别有两点:
Angular中的$q 集成了 ng.$rootScope.Scope Scope模型观察机制,这意味着对models 的解决或拒绝速度将会更快,避免不必要的浏览器重绘(会导致UI闪烁)。
Q 比 $q拥有更多的功能特性,但带来的是代码字节数的增加。 $q 很轻量级,但包含了一般异步任务所需的所有重要功能。
it('should simulate promise', inject(function($q, $rootScope) { var deferred = $q.defer(); var promise = deferred.promise; var resolvedValue; promise.then(function(value) { resolvedValue = value; }); expect(resolvedValue).toBeUndefined(); // 模拟 promise 的 resolving deferred.resolve(123); // 注意 'then' function 不是同步调用的. // 因为我们想要 promise API 一直是异步的(async), // 不管是在同步调用还是异步调用中都是如此. expect(resolvedValue).toBeUndefined(); // 使用 $apply()将 promise resolution 传递到 'then' functions . $rootScope.$apply(); expect(resolvedValue).toEqual(123); }));
$rootScope
结合多个promises为单个promise,在所有输入的promise都处理之后,组合之后的promise才会处理完成。
参数: promises
类型: Array.
描述: promises的数组或者引用
返回: Promise 返回单个的 promise,将与一个数组解决/散列值, 每个值对应于在相同的索引/关键的承诺 承诺 /散列数组。 如果任何承诺解决排斥,这产生的承诺将被拒绝 拒绝相同的值。(想看更多就到PHP中文网AngularJS开发手册中学习)
创建一个 递延 对象代表一个将来完成任务。
返回 Deferred 返回一个新实例的Deferred。
创建一个指定拒绝原因的promise. 此api应该用于在一个promises链中进行拒绝。 如果你正在处理promise 链中的最后一个promise,你不需要担心。
把 deferreds/promises 与我们熟悉的的 try/catch/throw行为进行对比,可以认为 reject 相当于 JavaScript 中的throw 关键字。 这也意味着如果你通过一个 promise 的 error回调, “catch”了一个错误 ,你想要指明当前的承诺已经执行出错了,就必须重新抛出一个“附带了错误信息,拒绝通过的reject” 。
promiseB = promiseA.then(function(result) { // success: 此处可以执行某些操作,然后直接使用原有的result, // 或者对result进行操作,来处理接下来的promiseB return result; }, function(reason) { // error: handle the error if possible and // resolve promiseB with newPromiseOrValue, // 否则转向拒绝 promiseB 的分支 if (canHandle(reason)) { // 处理错误和恢复 return newPromiseOrValue; } return $q.reject(reason); });
参数: reason
类型: *
描述: Constant, message, exception 或代表拒绝原因的 object。
返回: Promise 返回一个promise ,已经因为 reason 而被拒绝了 。
将一个对象(可能是value 或 [第三方]then-able promise) 包装为一个 $q promise。 这在你不确定所处理的对象是否是一个promise 时是很有用的,有可能该对象来自于一个不被信任的源头。
参数: value
类型: *
描述: promise 的值
返回 Promise 根据传入的值/或promise 返回一个包装后的 promise
本篇文章到这就结束了(想看更多就到PHP中文网AngularJS使用手册中学习),有问题的可以在下方留言提问。
Das obige ist der detaillierte Inhalt vonWas sind Dienste in AngularJS? Einführung in die Verwendung von AngularJS. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!