oclazyload的尝试

https://oclazyload.readme.io/docs
http://www.cnblogs.com/BestMePeng/p/AngularJS_ocLazyLoad.html

模块依赖

var appModule = angular.module("app", ["oc.lazyLoad"]);

配置

appModule.config(['$ocLazyLoadProvider', function ($ocLazyLoadProvider) {
    $ocLazyLoadProvider.config({
        insertBefore: 'ng_load_plugins_before', // load the css files before a LINK element with this ID.
        debug: false,
        events: true,
        modules: []
    });
}]);


   <link id="ng_load_plugins_before" />  

在路由中加载

        $urlRouterProvider.otherwise("/tenant/dashboard"); //Entrance page for a tenant
        $stateProvider.state('tenant.dashboard', {
            url: '/dashboard',
            templateUrl: '~/Mt/tenant/views/dashboard/index.cshtml',
            resolve: {
                deps: ["$ocLazyLoad", function ($ocLazyLoad) {
                    return $ocLazyLoad.load(
                        [
                            "/libs/jvectormap/jquery-jvectormap-1.2.2.css",
                            "/libs/jvectormap/jquery-jvectormap-1.2.2.min.js",
                            "/libs/jvectormap/jquery-jvectormap-world-mill-en.js"
                        ]);
                }]
            }
        });

1. 加载到的js,css没有添加到配置中定义的link 前面，而是在head的底部（可能配置没配对吧）
2. <script/>自动添加了 async。需要通过promise解决加载的次序问题

直接在controller中加载

(function () {
    appModule.controller('myCtr', [
        '$scope', '$ocLazyLoad',
        function ($scope,  $ocLazyLoad) {
            $ocLazyLoad.load([
                "/libs/jvectormap/jquery-jvectormap-1.2.2.css",
                "/libs/jvectormap/jquery-jvectormap-1.2.2.min.js"
            ]).then(function () {
                $ocLazyLoad.load("/libs/jvectormap/jquery-jvectormap-world-mill-en.js")
                    .then(function () {
                        $('#world-map-markers').vectorMap({map: 'world_mill_en'});
                    });
            });
        }
    ]);
}

转载于:https://www.cnblogs.com/wj033/p/6806501.html