问题描述
main.js中定义好配置项
requirejs.config({ paths: {jQuery: ’../lib/jquery.min’,angular: ’../lib/angular.min’,angularRouter: ’../lib/angular-route.min’,angularAnimate: ’../lib/angular-animate.min’,ngNotify: ’../lib/angular-atomic-notify’,api: ’../js/common/api’,utils: ’../js/common/utils’ }, shim: {’angular’: { deps: [’jQuery’], exports: ’angular’},angularRouter: { deps: [’angular’], exports: ’ngRoute’},angularAnimate: { deps: [’angular’]},ngNotify: { deps: [’angular’]},api: { deps: [’angular’]},utils: { deps: [’angular’]} }});// 手动开启angular服务require([’angular’, ’app’], function(angular){ angular.element(document).ready(function(){angular.bootstrap(document, [’yceMain’]); });});
app中定义模块与路由
app.js
define([’angular’, ’angularRouter’, ’ngNotify’, ’angularAnimate’, ’api’, ’utils’], function(angular){ var yceMain = angular.module(’yceMain’,[’ngRoute’, ’atomic-notify’, ’ngAnimate’]); yceMain.config([’$routeProvider’, ’$controllerProvider’, function ($routeProvider, $controllerProvider){$routeProvider .when(’/dashBoard’, {templateUrl: ’views/dashBoard.html’ }) .when(’/appManage’, {templateUrl: ’views/appManage.html’,controller: ’appManage’ }) }]); return yceMain;});
appManage controller.js代码如下
define([’app’], function (yceMain){ yceMain.controller(’appManage’, [’$scope’ , function ($scope){$scope.aa = 11; }]);});
页面报错
Error: [ng:areq] http://errors.angularjs.org/1.5.0/ng/areq?p0=appManage&p1=not%20aNaNunction%2C%20got%20undefined
若在app.js中定义appManage controller,则视图中可以拿到数据,但如果在appManage controller.js 使用define([’app’],xx) 获取angular.module则取不到,求解。
问题解答
回答1:define([’app’], function (yceMain){ yceMain.controller(’appManage’, [’$scope’ , function ($scope){$scope.aa = 11; }]);});
这个app应该是没有被注入进去的,你console.log(yceMain)一下。如果你只是想将appManage这个控制器绑定到app这个模块里面,应该可以这么写:
// appManage controller.jsangular.module(’app’).controller(’appManage’, [’$scope’ , function ($scope){ $scope.aa = 11;}]);
当然,这个controller也要引入到页面里面去的
我之前是用ui-router + oclazyload
回答2:已解决,问题在于angular在开启ng-app服务之前,要把所以的controller,service都要注册完成。但是我的想法是要异步加载controller,通过require。
function ctrlRegister (ctrlName, ctrlModule) {return function ($q) { var defer = $q.defer(); require(ctrlModule, function (controller) {$controllerProvider.register(ctrlName, controller);defer.resolve(); }); return defer.promise;} }
该函数完美解决问题,感谢/a/11...。