AngularJS denetleyicisinin birindeki temassız yük harici JavaScript

Question

Rotalarımın bir kısmı dış JS'den işleve gereksinim duyar. Bu JS'lerin sadece belirli yollarda (örneğin, /upload'un fotoğraf yükleme için bazı JS'ye gereksinim duyması, /photos'un lightbox için başka bir JS'ye gereksinim duyması, /funny'un animasyon öğeleri için JS'ye ihtiyacı vardır) hepsini yüklemek istemiyorum.

Bu harici JavaScripts temasıyla yükleme için en iyi uygulama nedir?

olanlar rotalar (örneğin kullanıcı daha sonra /upload gidebilir /photos sonra /upload tekrar) birden çok kez erişilebilir

Answer 1

Bir rotanın "çözersiniz" yöntemini kullanıyor böyle davalarını bilmek tek yolu. Bu yöntem, rota denetleyicisinin başlatılmasından önce yüklenecek bir bağımlılığı tanımlamak için kullanılabilir. Bu yöntemin farklı olası dönüş türlerinden biri bir sözdür. Böylece, harici JavaScript kodunuzu senkronize olmayan bir şekilde yüklemeye başlamak ve harici komut dosyalarınız yüklendiğinde çözülen bir söz vermek için bunu kullanabilirsiniz.

Bunun için belgeler şu adreste bulunabilir: https://docs.angularjs.org/api/ngRoute/provider/$routeProvider "when" bölümünde.

Answer 2

@ alex3683'ün yanıtı muhtemelen doğru AngularJS biçimidir, ancak kavramı anlamadım, bunun yerine jQuery'nin getScript() sürümünü kullanın. Bu nedenle, CoffeeScript'te:

Sadece kontrol cihazınızdan arayın. AngularJS hizmetleri tembel ve singleton olduğundan, bu sadece komut dosyasını bir kez yükler.

Answer 3

Alex'in belirttiğine ek olarak, denetleyiciler ve yönergeler gibi tembel yükleme AngularJS temeli olacak olursanız, modül API yerine bunları kaydetmek için ilgili sağlayıcıyı kullanmanız gerekir. Uygulama önyüklendikten sonra modül API'sı kullanılarak kaydedilmiş olan eserler, uygulama için mevcut olmayacaktır. Örneğin, ben bir blog yazısı yazdım

angular.module('app').controller('SomeLazyController', function($scope) 
{ 
    $scope.key = '...'; 
}); 

bunun yerine

$controllerProvider.register('SomeLazyController', function($scope) 
{ 
    $scope.key = '...'; 
}); 

... nasıl kullanılacağı yanı sıra bu detaylandırma ... Bu gibi tembeller denetleyicisi tanımlarsınız ' AngularJS'de temkin yüklemeyi uygulamak için Alex'in konuştuğu yöntemi çözümleyin. http://ify.io/lazy-loading-in-angularjs/