AngularJS-將第三方異步加載的庫包裝為服務

Question

我有一個第三方庫，它異​​步加載到我的頁面上，我想將其用作服務。

如何將加載代碼包裝在angular服務中？ 一般來說，最佳做法是什么？

目前，我的方法是這樣的：

angular.module('myAPIServices', []).
factory('MyAPI', function () {
    return {
        \\ API is declared at the loaded script
        doStuff:function(){$window.API.doStuff()} 
    };
});

然后在Angular范圍之外的頁面上

(function () {
    var js = document.createElement('script');
    var loc = document.getElementsByTagName('script')[0];
    js.async = true;
    js.src = "myAPI.js";
    loc.parentNode.insertBefore(js, loc);
}());

Answer 1

一種可能性是將您的庫調用包裝在$ q中 。 這種有角度的服務會返回一個承諾，您可以在完全加載庫后解決該承諾。

您的doStuff函數將類似於：

doStuff: function() {
   var deferred = $q.defer();

   myAsyncCall().success(function(data) {
      deferred.resolve(data);
   });
   return deferred.promise;
}

在您的控制器中，您可以使用then()函數來處理結果。

第二種可能性是回調。 這是兩種類型的示例 。

如果您的庫正在處理DOM，則最好將其包裝在指令中。