1

RequireJS を使用した Angular アプリケーションで作業しようとしていますが、Argument '(contoller)' is not a function, got undefined. 私が何を間違えたのでしょうか?

アプリ/main.js、

require.config({
    baseUrl: "",

    // alias libraries paths.  Must set 'angular'
    paths: {
        'domReady': 'bower_components/requirejs-domready/domReady',
        'angular': 'bower_components/angular/angular',
        'angular-route': 'bower_components/angular-route/angular-route',
        'jquery': 'bower_components/jquery/dist/jquery'
    },

    // Add angular modules that does not support AMD out of the box, put it in a shim
    shim: {
        'angular': {
            exports: 'angular'
        },
        'angular-route': {
            exports: 'angular'
        }
    },

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

アプリ/app.js、

define([
    'angular',
    'angular-route',
    'jquery'
], function (ng,ngRoute,$) {
    'use strict';
    console.log($('h1').length);

    return ng.module('app', ['ngRoute']).
        config(['$routeProvider', function($routeProvider) {

            $routeProvider.when('/home', {
                templateUrl: 'view/home.html',
                controller: 'HomeCtrl',
                controllerUrl: 'app/home'
            });

            $routeProvider.when('/view1', {
                templateUrl: 'view/view1.html',
                controller: 'View1Ctrl',
                controllerUrl: 'app/view'
            });

            //$routeProvider.otherwise({redirectTo: '/home'});
    }]); 
});

app/home.js、

define(['app/app'], function (app) {
    app.controller('HomeCtrl', function ($scope) {
        $scope.message = "Message from HomeCtrl"; 
    });
});

エラー、

Error: [ng:areq] Argument 'HomeCtrl' is not a function, got undefined

しかし、ng.module('app', ['ngRoute']).config(...)その後コントローラーを連結すると、正常に動作し、

アプリ/app.js、

define([
    'angular',
    'angular-route',
    'jquery'
], function (ng,ngRoute,$) {
    'use strict';
    console.log($('h1').length);

    return ng.module('app', ['ngRoute']).
        config(['$routeProvider', function($routeProvider) {

            $routeProvider.when('/home', {
                templateUrl: 'view/home.html',
                controller: 'HomeCtrl',
                //controllerUrl: 'app/home'
            });

            $routeProvider.when('/view1', {
                templateUrl: 'view/view1.html',
                controller: 'View1Ctrl',
                //controllerUrl: 'app/view'
            });

            //$routeProvider.otherwise({redirectTo: '/home'});
    }]).controller('HomeCtrl', function ($scope) {
        $scope.message = "Message from HomeCtrl"; 
    }).controller('View1Ctrl', function ($scope) {
        $scope.message = "Message from View1Ctrl"; 
    }); 
});

どうして??

4

1 に答える 1