AngularJS - gói thư viện được tải bên thứ ba asynchronic như một dịch vụ

Question

Tôi có thư viện của bên thứ ba tải lên trang của tôi một cách không đồng bộ và tôi muốn sử dụng nó làm dịch vụ.

Tôi làm cách nào để bao bọc mã tải bên trong dịch vụ góc? Nói chung những gì sẽ là thực hành tốt nhất?

Tại thời điểm này cách tiếp cận của tôi là một cái gì đó giống như vậy:

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

và sau đó trên trang ngoài phạm vi góc

(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

Một posibility là để bọc gọi thư viện của bạn trong $q. Dịch vụ góc này trả về một lời hứa, mà bạn có thể giải quyết khi thư viện được tải đầy đủ.

chức năng doStuff của bạn sẽ là một cái gì đó như:

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

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

Trong điều khiển của bạn, bạn sử dụng then() chức năng để xử lý kết quả.

Khả năng thứ hai là gọi lại. Đây là một số example của cả hai loại.

Nếu thư viện của bạn đang thao tác DOM, tốt hơn nên bọc nó theo chỉ thị.