Yüklü AngularJS uygulaması async

Question

AngularJS uygulamasını senkronize olmayan bir şekilde yüklemeye çalışıyorum, ancak bunun mümkün olmayacağından korkuyorum.

Maalesef, hiç bir başarıya ulaşmadan, this guide by CSS tricks örneklerini takip ettim.

<script src="https://code.jquery.com/jquery-2.2.2.min.js"></script> 
<script> 
     jQuery.cachedScript = function(url, options) { 
      options = $.extend(options || {}, { 
       dataType: "script", 
       cache: true, 
       url: url 
      }); 

      return jQuery.ajax(options); 
     }; 
     $.cachedScript("https://code.angularjs.org/1.5.3/angular.min.js") 
     .done(function() { 
      return $.cachedScript("scripts/vendor.js") 
     }) 
     .done(function() { 
      $.cachedScript("scripts/app.js", { cache : false }); 
     }); 
</script> 

tüm komut dosyalarının doğru yüklenir Bu şekilde:

girişimi ilk olarak bir ajax çağrısı ile diğer komut yüklemek için kullanabilir sonra sadece jQuery yükleyin ve etmekti kapatır.

Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.5.3/$injector/modulerr?p0=app&p1=Error%3A%20%…0c%20(https%3A%2F%2Fcode.angularjs.org%2F1.5.3%2Fangular.min.js%3A20%3A463) 

Daha sonra bu denedim: Ancak, bu hatayı alıyorum

<script src="https://code.jquery.com/jquery-2.2.2.min.js"></script> 
<script src="https://code.angularjs.org/1.5.3/angular.min.js"></script> 
<script src="scripts/vendor.js"></script> 
<script> 
     jQuery.cachedScript = function(url, options) { 
      options = $.extend(options || {}, { 
       dataType: "script", 
       cache: true, 
       url: url 
      }); 

      return jQuery.ajax(options); 
     }; 
     $.cachedScript("scripts/app.js", { cache : false }); 

</script> 

Ancak aynı hata atılır.

Sorun, angularjs'nin app.js dosyasından önce yüklenmesinden kaynaklanıyor gibi görünüyor, ancak bu oldukça garip görünüyor.

Bu nedenle soru, angularjs dosyalarını async yüklemek mümkün değil mi?

PS Diğer yollardan da denedim, ancak dosyaların yüklenmesi gereken sıralar olarak çalışmayacaklar (değişkenler ...).

Örneğin, ben de html async niteliğini denedim:

<script async src="https://code.jquery.com/jquery-2.2.2.min.js"></script> 
<script async src="https://code.angularjs.org/1.5.3/angular.min.js"></script> 
<script async src="scripts/vendor.js"></script> 
<script async src="scripts/app.js"></script> 

Ama bu komut tahmin edilemez bir sırayla yüklenir bu yolla olarak başarısız olur. onlar hala bir öngörülemeyen sırayla yüklenir olarak

Ben de el

(function() { 
    var urls = [ 
     "scripts/app.js", 
     "scripts/vendor.js", 
     "https://code.angularjs.org/1.5.3/angular.min.js", 
     "https://code.jquery.com/jquery-2.2.2.min.js", 
    ]; 
    for (var i = 0; i < urls.length; i++) { 
     var po = document.createElement('script'); po.type = 'text/javascript'; po.async = false; 
     po.src = urls[i]; 
     var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s); 
    } 
})(); 

(zamansız özellikli olmadan) Ama yine de başarılı olamadı bağlantıları enjekte çalıştık.

Answer 1

app.js henüz yüklü değil çünkü otomatik uygulama ve bootstrap çalışır ngApp direktifini bulmak için DOM ayrıştırır zaman açısal, sen, ng-app yönergesini kullandığınız dediğim gibi, açısal atarsa .

Yani, bu özelliğinizi kaldırmak gerekir ve sizin app.js eklemek aşağıdaki satırları:

angular.bootstrap(document.getElementById('ngAppContainer'), ['app']);