Ответ 1
Angular не поддерживает ленивую загрузку как функцию, но все еще может быть лениво загружено!
Ключ находится в функции config
:
var providers = {};
var app = angular.module('myApp', []);
app.config(function(
$controllerProvider,
$compileProvider,
$routeProvider,
$filterProvider,
$provide
) {
providers.controllerProvider = $controllerProvider;
providers.compileProvider = $compileProvider;
providers.routeProvider = $routeProvider;
providers.filterProvider = $filterProvider;
providers.provide = $provide;
});
Теперь вы можете использовать кэшированных поставщиков для функций lazy-load (register) Angular.
Lazy-load контроллер:
function myCtrl($scope) {
//etc
}
providers.controllerProvider.register('myCtrl', myCtrl);
Lazy-load директива:
function myDirectiveName() {
//etc
}
providers.compileProvider.directive('myDirectiveName', myDirectiveName);
Для практического и более продвинутого примера См. мой ответ на этот пост (нажмите)., в котором я ленивый вид загрузки и их контроллеры из внешних файлов при прокрутке страницы.
Простая демонстрация:
Живая демонстрация здесь (нажмите)
<div lazy></div>
Angular логика:
var providers = {};
var app = angular.module('myApp', []);
app.config(function(
$controllerProvider,
$compileProvider,
$routeProvider,
$filterProvider,
$provide
) {
providers.controllerProvider = $controllerProvider;
providers.compileProvider = $compileProvider;
providers.routeProvider = $routeProvider;
providers.filterProvider = $filterProvider;
providers.provide = $provide;
});
app.directive('lazy', function() {
return {
restrict: 'A',
compile: function(element, attrs) {
providers.controllerProvider.register('myCtrl', myCtrl);
providers.compileProvider.directive('myDirectiveName', myDirectiveName);
var span = angular.element('<span></span>')
.attr('my-directive-name', '')
.attr('ng-controller', 'myCtrl');
element.append(span);
}
};
});
function myDirectiveName() {
return {
restrict: 'A',
compile: function(element, attrs) {
var str = 'This text came from a lazy-loaded directive {{anotherString}}';
element.text(str);
}
};
}
function myCtrl($scope) {
$scope.anotherString = 'and this text came from a lazy-loaded controller!';
}