Question

我有一个包含10个视图和多个共享组件的应用程序

--app
-------components
-------------home
-----------------homeController.js
-----------------homeDirective.js
-----------------home.html
 .
 .
 .
-------shared
----------modals
------------someModal
--------------- someModalController.js
--------------- someModal.html

通过角度路由加载组件

(function() {

    'use strict';

    angular
        .module('app')
        .config(appConfig);

    function appConfig($routeProvider) {
        $routeProvider.
        when("/home", { templateUrl: "app/components/home/home.html", controller: 'homeController' })............
        otherwise({ redirectTo: "/home" });
    }
})();

在不同组件中使用的模式，当主页面包含所有脚本文件时，所有操作都可以使用。例如

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

</head>

<body ng-app="fleetCam" ng-controller="appController">
    <div id="wrapper">

    <div id="page-wrapper">
        <ng-view>
        </ng-view>
    </div>
</div>
<!-- /#wrapper -->

<!-- jQuery -->
<script src="Scripts/jquery-2.1.4.min.js"></script>
<script src="Scripts/angular.js"></script>
<script src="Scripts/angular-route.js"></script>
<script src="Scripts/ngStorage.js"></script>



<script src="appMain/app.module.js"></script>
<script src="appMain/app.routes.js"></script>
<script src="appMain/app.services.js"></script>
<script src="appMain/app.directive.js"></script>


 <script src="appMain/components/home/homeController.js"></script>
   <script src="appMain/components/home/aboutController.js"></script>
   <script src="appMain/shared/modal/insert/insertController.js"></script>

我正在寻找一种方法来删除最后三个脚本标记并动态加载控制器或其他依赖项。我已经搜索了很多关于延迟加载但没有人在我的上下文中工作，特别是当我添加共享组件时。

Answer 1

您可以使用官方角度种子回购中的异步部分中的模式：https://github.com/angular/angular-seed/#loading-angular-asynchronously

https://github.com/angular/angular-seed/blob/master/app/index-async.html

这取决于ded / script“Async JavaScript loader＆amp; dependency manager”https://github.com/ded/script.js

如何动态加载角度控制器

1 个答案: