我正在将AngularJS与RequireJS一起使用。

新问题:RequireJS不加载任何控制器。
我正在使用this tutorial

旧问题:
RequireJS加载main.js文件,bootstrap.min.js文件和jQuery。这很好。
但是由于某种原因,它不会加载角度。

我正在使用chrome,并且在开发人员工具标签“网络”中仅加载了上述3个文件。

console.log(typeof angular);等于undefined。 (我已经在开发人员控制台中尝试过)

控制台中没有显示错误消息!

解决方案:我通过在deps数组中添加“角度”来解决此问题。

我的main.js代码是:
    //需要JS配置

require.config({ // Code format changed
// alias library paths
paths: {
    'jquery': '../bower_components/jquery/dist/jquery.min',
    'domReady': '../bower_components/requirejs-domready/domReady',
    'angular': '../bower_components/angular/angular.min',
    'angular-route': '../bower_components/angular-route/angular-route.min',
    'ngFx': '../bower_components/ngFx/dist/ngFx.min',
    'angular-ui-router': '../bower_components/angular-ui-router/release/angular-ui-router.min',
    'bootstrap': '../bower_components/bootstrap/dist/js/bootstrap.min'
},

// angular does not support AMD out of the box, put it in a shim
shim: {
    'angular': {
        exports: 'angular'
    },
    'angular-route': {
        deps: [ "angular" ]
    },
    'ngFx': {
        deps: [ "angular" ]
    },
    'angular-ui-router': {
        deps: [ "angular" ]
    },
    'bootstrap': {
        deps: [ "jquery" ]
    }
},

// Kick start application
deps: [
    './bootstrap',
    'domReady',
    'angular',
    'angular-route',
    'ngFx',
    'angular-ui-router',
    'bootstrap'
]
});


我的bootstrap.js文件:

define([
   'require',
   'angular',
   'app',
   'routes'
], function (require, ng) {
    'use strict';

    require(['domReady!'], function (document) {
        ng.bootstrap(document, ['app']);
    });
});


我的app.js文件:

define([
    'angular',
    './controllers/index',
    './directives/index',
    './filters/index',
    './services/index'
], function (ng) {
    'use strict';

    return ng.module('app', [
        'app.services',
        'app.controllers',
        'app.filters',
        'app.directives',
        'ngFx',
        'ngRoute'
    ]).config(function ($urlRouterProvider) {
        $urlRouterProvider.otherwise('/');
    });
});


资料夹结构:

angular
    controllers
        index.js
        menu.js
        module.js
    directives
    filters
    services

    app.js
    bootstrap.js
    main.js
    routes.js
bower_components
    ...


感谢您的帮助! :-)

最佳答案

我认为您应该将AngularJS.bootstrap与RequireJS一起使用。另外,您还应该向Deps添加角度。
这里的api参考:

https://docs.angularjs.org/api/ng/function/angular.bootstrap

07-24 09:38
查看更多