每个视图加载一个控制器AngularJS

时间:2016-01-05 06:25:11

标签: javascript angularjs spring jsp

我有一个具有以下角度文件结构的Spring + AngularJS Web应用程序。 mainmodule.js - 所有配置和路由都在哪里 controller1.js controller2.js

我的主页是home.jsp,我导入了所有这些文件。随着项目变得越来越大,我想我们总共有50多个文件。因此,我不想将它们转储到home.jsp中,而是将它们加载到相应的视图文件中。但是当我尝试在相应的JSP文件中加载controller1.js时,我得到以下错误。

[ng:areq] http://errors.angularjs.org/1.4.4/ng/areq?p0=dashboardController&p1=not%20aNaNunction%2C%20got%20undefined

有人可以帮我确定问题所在,我该如何实现?

BTW我使用的是ui-router而不是默认的ngRoute。

1 个答案:

答案 0 :(得分:3)

处理该场景的一种方法是在每个路由上定义resolve属性并为其分配一个返回promise的函数。该函数可以处理动态加载包含目标控制器的脚本,并在加载完成后解析promise。例如:

$routeProvider
.when('/customers',
    {
        templateUrl: '/app/views/customers.html',
        resolve: resolveController('/app/controllers/customersController.js')
    });

但问题的最佳解决方案是使用AngularJS的 RequireJS 框架为每个视图动态加载控制器。 有一个非常有趣的消息来源解释了这一点:http://weblogs.asp.net/dwahlin/dynamically-loading-controllers-and-views-with-angularjs-and-requirejs

RequireJS官方网站:http://requirejs.org