Question

说明：

我知道这真的很深，我不会在这里得到任何帮助，但我已经用尽了整个互联网的解决方案。

缺点是我想让我的ui-router动态，并且使用控制器，在使用需求时。

我知道Dan Wahlin有类似的东西，但他在他的main.js文件中硬编码他的控制器和我更喜欢保持与$ state.routes相关的所有内容来自DB，即。模板＆amp;控制器

这是我得到的错误：

错误：[ng：areq]参数'MyDashboardCtrl'不是函数，得到了未定义 http://errors.angularjs.org/1.2.9/ng/areq?p0=MyDashboardCtrl&p1=not%20aNaNunction%2C%20got%20undefined

我知道问题是Dashboard控制器没有被缓存，即使它在ui-router中作为默认路由。

当Dashboard.html出现时，通过 ui-view =“container”，控制器就不会被缓存了。

enter image description here

main.js：

require.config({

baseUrl: "/app",
paths: {
    'app' : '/app/app',
    'jquery': '/vendor/jquery/dist/jquery.min',
    'angular': '/vendor/angular/angular',
    'angular-bootstrap': '/vendor/angular-bootstrap/ui-bootstrap-tpls.min',
    'angular-breeze': '/vendor/breeze.js.labs/breeze.angular',
    'angular-cookies': '/vendor/angular-cookies/angular-cookies.min',
    'angular-resource': '/vendor/angular-resource/angular-resource.min',
    'angular-route': '/vendor/angular-route/angular-route.min',
    'angular-sanitize': '/vendor/angular-sanitize/angular-sanitize.min',
    'angular-touch': '/vendor/angular-touch/angular-touch.min',
    'angular-ui-router':'/vendor/angular-ui-router/release/angular-ui-router.min',
    'angular-ui-tree':'/vendor/angular-ui-tree/angular-ui-tree.min',
    'angularAMD': '/vendor/angularAMD/angularAMD.min',
    'bootstrap':'/vendor/bootstrap/dist/js/bootstrap.min',
    'breeze':'/vendor/breeze/breeze.min',
    'breeze-directives':'/vendor/breeze.js.labs/breeze.directives',
    'highcharts':'/vendor/highcharts/highcharts',
    'highchartsng':'/vendor/highcharts/highcharts-ng',
    'moment': '/vendor/moment/min/moment.min',
    'ngload': '/vendor/ng-load/ng-load',
    'q': '/vendor/q/q',
    'spin': '/vendor/javascripts/jquery.spin',
    'toastr': '/vendor/toastr/toastr.min',
    'tweenMax':'/vendor/greensock/src/minified/TweenMax.min',
    'underscore':'/vendor/underscore/underscore.min'
},

// Add angular modules that does not support AMD out of the box, put it in a shim
shim: {
    angular: {
        exports: "angular"
    },
    'angularAMD': ['angular'],
    'angular-ui-router':['angular'],
    'highchartsng': {deps:['highcharts']},
    'bootstrap': {deps:['jquery']},
    'toastr': {deps:['jquery']}
},

// kick start application
deps: ['app'] });

app.js：

define(['angularAMD', 'angular-ui-router', 'config/common', 
            'layout/services/dBoardSvc', 'localize/LangSettings.Svc'], 
function (angularAMD, common, dBoardSvc, LangSettingsSvc) {

var $stateProviderRef = null;
var $urlRouterProviderRef = null;

var app = angular.module("anuApp", ['ui.router'])
    /* @ngInject */
    .config(function ($locationProvider, $urlRouterProvider, $stateProvider) {
        $urlRouterProviderRef = $urlRouterProvider;
        $stateProviderRef = $stateProvider;
        $locationProvider.html5Mode(false);
        $urlRouterProviderRef.otherwise('/')
    })
    /* @ngInject */
    .run(function($q, $rootScope, $state, $window, common, dBoardSvc, LangSettingsSvc){
        // set initial current language
        LangSettingsSvc.currentLang = LangSettingsSvc.languages[0];
        dBoardSvc.all().success(function (data) {
            var startUp = undefined;
            angular.forEach(data, function (value) {
                var tmp = 6;
                angular.forEach(value.viewGroups, function (viewGroup, key) {
                    angular.forEach(viewGroup.viewStates, function (viewState, key) {
                        var viewStateUrl = undefined;
                        if (viewState.isStartUp == true && startUp == undefined) {
                            startUp = viewState.name;
                        }

                        if (viewState.url != '0') {
                            viewStateUrl = viewState.name + "/:moduleId";
                        }

                        var state = {
                            "url": viewStateUrl,
                            "parent": viewState.parentName,
                            "abstract": viewState.isAbstract,
                            "views": {}
                        };

                        angular.forEach(viewState.views, function (view) {
                            state.views[view.name] = {
                                controller: view.controllerName,
                                templateUrl: common.appRoot +  view.templateUrl + '.html',
                                controllerUrl: common.appRoot +  view.controllerUrl + '.js'
                            };

                        });
                        $stateProviderRef.state(viewState.name, angularAMD.route(state));
     --------->>>>>>>>>>>>>>>>>  **console.log(state);**
                    });
                });
            });
            $state.go(startUp);
        });
    });
// Bootstrap Angular when DOM is ready    
angularAMD.bootstrap(app);
return app; });

enter image description here

DashboardCtrl：

define(['app'], function (app) {
'use strict';

app.register.controller('MyDashboardCtrl', MyDashboardCtrl);

/* @ngInject */
function MyDashboardCtrl($scope){
    $scope.pageTitle = 'MyDashboardCtrl';
};

}）;

结论：

这可能是解决问题的时候了吗？我真的在这里抓住吸管，任何帮助都会受到赞赏。

Answer 1

问题在于我的控制器，下面是正确的方法：

define(['angularAMD'], function (app) {
'use strict'

 /* @ngInject */  
app.controller('MyDashboardCtrl', MyDashboardCtrl);
function MyDashboardCtrl($scope) {
    $scope.pageTitle = 'This controller now loads dynamically';
};

// MyDashboardCtrl.$inject = ['$scope']; 
});

NOTHING在我的应用程序中缺少供应商文件的硬编码。我的控制器，我的观点和我的服务都是充满活力的。基于授权!!!

enter image description here

我希望这有助于其他人，因为能够利用动态路线的必需品的含义意味着不仅仅有一个：

将javaScript最小化为视图所需的内容，但将其与动态视图和视图相结合。登录，
可以有效地隐藏相应用户可能无权访问的所有客户端脚本。

我希望这几天的例子不仅仅是'Hello World';（

AngularAMD，动态UI路由器，RequireJS - “错误：'MyDashboardCtrl'不是函数，未定义”

1 个答案: