Сделать угловой Вручную перейти к фазе компиляции

Я использую ocLazyLoad для загрузки моих модулей по требованию в Angular. Эти модули совершенно разные, и мы должны проверить на сервере, какой модуль нам следует загрузить. Перед использованием ocLazyLoad я загружал все сцепленные js-файлы этих отдельных модулей в моем главном представлении. Так что все они мы загружаем.

Теперь, когда очевидно, что я загружаю эти файлы по требованию, это означает, что он должен прочитать данные с сервера и посмотреть, какие модули следует загрузить, загрузить файл мегабайта и, что наиболее важно, загрузить его до того, как angular начнет компилировать View.

Я использовал обещание ocLazyLoad для $ compile view (body), но так как это делалось дважды или даже чаще, иногда мои директивы не работали.

Поэтому я думаю, что у меня есть два варианта:

  1. Сделайте угловую вручную, скомпилируйте представление (которое я много искал и не мог найти как!!) после того, как модули были введены и загружены ocLazyLoad!

  2. Прочитайте список необходимых модулей с сервера и используйте LazyLoad на этапе запуска приложения или даже до angular.bootstrap. (Я уже сделал это, но так как запрос $http выполняется асинхронно, он иногда работает и загружается до угловой компиляции, а иногда нет)

Буду признателен, если вы поможете мне с этим.

spa.run(['$rootScope', '$location', '$route', '$localStore', '$templateCache', 'Analytics', 'preflightValue', '$ocLazyLoad', '$http',
'$compile', function($rootScope, $location, $route, $localStore, $templateCache, Analytics, preflightValue, $ocLazyLoad, $http, $compile ) {
    $rootScope.$on('cfpLoadingBar:completed', function(event, args) {
        angular.element($('body')).addClass('cfp-done');
    });

    $http({
        method: 'POST',
        url: url,
        data: {
            route: "/dashboard"
        },
        headers: {
            // My Headers
        }
    }).success(function (data, status, header, config) {
        var currentModules = $ocLazyLoad.getModules();
        for (var i = 0; i < data.data.cloudwares.length; i++) {
            var moduleName = data.data.cloudwares[i];
            if (currentModules.indexOf(moduleName) === -1 && moduleName !== 'bot-manager') {
                preflightValue.addModule(moduleName);
            }
        }
        $ocLazyLoad.load(preflightValue.modulesList()).then(function () {
            preflightValue.emptyList();
        });
    });
}]);

// Обновить

Обратите внимание, что мы не используем ui-router или ngRouter. Мы получаем состояние нашего маршрута с сервера каждый раз, используя $resource.

2 ответа

Решение

Я на самом деле решил эту проблему, задав еще один вопрос! Все, что мне нужно было сделать, это вернуть два обещания!

Найдите решение здесь: используйте функцию разрешения $routeProvider внутри другой

В вашем конфигурационном файле попробуйте указать маршрут с помощью события lazyload.

app
.config(function ($stateProvider, $urlRouterProvider,ParseProvider){

        .state ('home', {
            url: '/home',
            // templateUrl: 'views/home.html',
            templateUrl: 'views/home.html',
            resolve: {
                loadPlugin: function($ocLazyLoad) {
                    return $ocLazyLoad.load ([
                        {
                            name: 'css',
                            insertBefore: '#app-level',
                            files: [
                                'vendors/bower_components/fullcalendar/dist/fullcalendar.min.css',
                            ],

                        },
                        {
                            name: 'vendors',
                            insertBefore: '#app-level-js',
                            files: [
                                'vendors/sparklines/jquery.sparkline.min.js',
                                'vendors/bower_components/jquery.easy-pie-chart/dist/jquery.easypiechart.min.js',
                                'vendors/bower_components/simpleWeather/jquery.simpleWeather.min.js'
                            ]
                        }
                    ])
                }
            }
        })
})

из этого вы можете загрузить любые скрипты на ваш взгляд.

Другие вопросы по тегам