Question

有没有办法以模块化方式构建/编写AngularJS 动态加载/需要 controllers/views，具体取决于SystemJS中的页面路由？

修改这是我目前所拥有的，作为使用SystemJS的试验

app.js - 这是在 index.html中导入的主要文件

// vendor
import angular from 'angular';

//Controllers
import controllers from './controllers/_index.js'

// Routes
import routes from './routes/routes.config.js';

var seedApp = angular.module('seedApp', ['seedApp.route', 'seedApp.controllers']);


angular.element(document).ready(function() {
    return angular.bootstrap(document.body, [seedApp.name], {
        strictDi: true
    });
});

export default seedApp;

_index.js - 所有控制器的索引

import { navCtrl } from './nav.js';
import { aboutCtrl } from './about.js';

var app = angular.module('seedApp.controllers', []);

app.controller('navCtrl', navCtrl);
app.controller('aboutCtrl', aboutCtrl);

routes.config.js

import 'angular-ui-router';

var app = angular.module('seedApp.route', ['ui.router']);


app.config(['$stateProvider', '$urlRouterProvider', function($stateProvider, $urlRouterProvider) {

    $urlRouterProvider.otherwise('/');

    $stateProvider
        .state('home', {
            url: '/',
            templateUrl: 'app/views/home.html'
        })
        .state('about', {
            url: '/about',
            templateUrl: 'app/views/about.html',
            controller: 'aboutCtrl as about'
        });
}]);

export default app;

Answer 1

简短回答NO。答案很长YES，但您需要使用ocLayzLoad angular插件，因为Angular 1.x本身不支持此功能（这在Angular 2.x中可能会有效）。顺便说一句，如果您尝试动态加载文件，则需要使用System.import

希望这有所帮助。

使用SystemJS动态加载AngularJS控制器/视图

1 个答案: