如何在 AngularJS UI 路由器中从bower_component加载文件

How do I load a file from bower_component within AngularJS UI router?

本文关键字:bower component 加载 文件 AngularJS UI 路由器      更新时间:2023-09-26

我想在点击特定 URL 时加载文件,但我还没有成功:

我的代码是这样的:

.state('admin.resources', {
            url: '/resources',
            templateUrl: 'views/admin/resources.html',
            controller: 'ResourceController as res',
            resolve: {
                loadMyFiles: function ($ocLazyLoad) {
                    return $ocLazyLoad.load({
                        name: 'venture',
                        files: [
                            'bower_components/angular-ui-tinymce/src/tinymce.js'
                        ]
                    })
                }
            }
        })

如果我将其包含在索引中,一切正常.html如下所示:

<script type="text/javascript" src="bower_components/angular-ui-tinymce/src/tinymce.js"></script>

我不想从索引加载id.html因为我不希望在加载网站后加载该页面。我需要在单独的页面上使用该脚本。

有什么建议吗?

为了使用 oclazyload,您需要将其放在 resolve 属性中:

$stateProvider.state('index', {
  url: "/", // root route
  views: {
    "lazyLoadView": {
      controller: 'AppCtrl', // This view will use AppCtrl loaded below in the resolve
      templateUrl: 'partials/main.html'
    }
  },
  resolve: { // Any property in resolve should return a promise and is executed before the view is loaded
    loadMyCtrl: ['$ocLazyLoad', function($ocLazyLoad) {
      // you can lazy load files for an existing module
             return $ocLazyLoad.load('js/AppCtrl.js');
    }]
  }
});

所有内容都在"使用路由器"中进行了解释和详细记录。