参数不是函数,使用angular bootstrap,ui-router和requirejs未定义

时间:2015-04-21 22:22:30

标签: angularjs requirejs angular-ui-router angularjs-bootstrap

我正在关注 Dan Wahlin使用requirejs动态加载控制器但使用角度ui-router的示例。

这是我的app.js

var bootstrapper = angular.module('etrading', ['ui.router', 'ngSanitize','kendo.directives', 'common']);

function routeProvider($stateProvider, $controllerProvider, $compileProvider, $filterProvider, $provide, routeResolverProvider) {
    $provide.decorator('$exceptionHandler', extendExceptionHandler);
    bootstrapper.register = {
        controller: $controllerProvider.register,
        directive: $compileProvider.directive,
        filter: $filterProvider.register,
        factory: $provide.factory,
        service: $provide.service
    };
    var route = routeResolverProvider.route();
    $stateProvider.state('etrading', route.resolve('shell', 'core/',  'vm')).state('equityportfolio', route.resolve('equityportfolio', 'equityportfolio/', 'vm'));
}

bootstrapper.config([
    '$stateProvider',
    '$controllerProvider',
    '$compileProvider',
    '$filterProvider',
    '$provide',
    'routeResolverProvider',
     routeProvider
]);

start.$inject = ['$state', '$rootScope', '$q', 'genXClientFactory'];
function start($state, $rootScope, $q) {
    //set the initial state
    $state.go('etrading');
}
bootstrapper.run(start);

这是我的角度引导程序的main.js

   define([
    'app',
    'common/common',
    'common/routeresolver',
    'common/logger',
    'common/commonfactory',
    'common/spinner',
    'common/genxInitializer',
    'common/route'
],
function () {
    angular.element(document).ready(function () {
        angular.bootstrap(document, ['etrading']);
    });
});

这是我的routeresolver.route方法

    var route = function () {
        function resolve(baseName, path, controllerAs, secure) {
            if (!path)
                path = '';
            var routeDef = {};
            var baseFileName = baseName.charAt(0).toLowerCase() + baseName.substr(1);
            routeDef.templateUrl = viewsDirectory + path + 'views/' + baseFileName + '.html';
            routeDef.controller = baseName + 'Controller';
            if (controllerAs)
                routeDef.controllerAs = controllerAs;
            routeDef.secure = (secure) ? secure : false;
            routeDef.resolve = {
                load: [
                    '$q',
                    '$rootScope',
                    function ($q, $rootScope) {
                        var dependencies = [controllersDirectory + path + 'controllers/' + baseFileName + 'Controller.js'];
                        return resolveDependencies($q, $rootScope, dependencies);
                    }
                ]
            };
            return routeDef;
        }
        function resolveDependencies($q, $rootScope, dependencies) {
            var defer = $q.defer();
            require(dependencies, function () {
                defer.resolve();
                 $rootScope.$apply();
            });
            return defer.promise;
        }
        var jsclass = {
            resolve: resolve
        };
        return jsclass;
    };

这是我试图注册的控制器

define(["require", "exports", 'app'], function (require, exports, app) {
var core;
(function (core) {
    var controller;
    (function (controller) {
        var Shell = (function () {
            function Shell($rootScope, common, config) {
            }
            Shell.$inject = ['$rootScope', 'common', 'config'];
            return Shell;
        })();
        controller.Shell = Shell;
        app.etrading.register.controller('shell', Shell);
    })(controller = core.controller || (core.controller = {}));
})(core = exports.core || (exports.core = {}));
});

我得到了这个:错误:[ng:areq]参数'shellController'不是函数,未定义这是在尝试解析依赖项时。请帮我解决一下这个。 谢谢。

1 个答案:

答案 0 :(得分:1)

在ui-router的路由获取后,检查控制器名称是否与状态更改中定义的控制器相同。

控制器名称必须是

 app.etrading.register.controller('shellController', Shell);

而不是app.etrading.register.controller('shell',Shell);