0

我正在关注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' 不是函数，未定义这是在尝试解决依赖关系时。请帮我解决一下这个。谢谢。

4

1 回答 1

1

发现在 ui-router 的路由成功后，它会检查控制器名称是否与状态更改中定义的控制器相同。

控制器名称必须是

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

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

于 2015-04-22T19:53:09.020 回答