Question

好的，我知道这个问题已经问了很多，但是我真的不确定我错过了什么。这段代码曾在某一点起作用，我离开了一段时间，然后添加了另一条路线（登录），现在RegisterController无法正常工作。我得到Error: [ng:areq] Argument 'RegisterController' is not a function, got undefined

路由：

(function () {
  'use strict';

  angular
    .module('thinkster.routes')
    .config(config);

  config.$inject = ['$routeProvider'];

  /**
  * @name config
  * @desc Define valid application routes
  */
  function config($routeProvider) {
    $routeProvider.when('/register', {
      controller: 'RegisterController', 
      controllerAs: 'vm',
      templateUrl: '/static/templates/authentication/register.html'
    }).when('/login', {
       controller: 'LoginController',
       controllerAs: 'vm',
       templateUrl: '/static/templates/authentication/login.html'
    }).otherwise('/');
  };
})();

register.controller.js

/**
* Register controller
* @namespace thinkster.authentication.controllers
*/
(function () {
  'use strict';

  angular
    .module('thinkster.authentication.controllers', [])
    .controller('RegisterController', RegisterController);

  RegisterController.$inject = ['$location', '$scope', 'Authentication'];

  /**
  * @namespace RegisterController
  */
  function RegisterController($location, $scope, Authentication) {
    var vm = this;

    vm.register = register;

    activate();

    /**
    * @name activate
    * @desc Actions to be performed when this controller is instantiated
    * @memberOf thinkster.authentication.controllers.RegisterController
    */
    function activate() {
     // If the user is authenticated, they should not be here.
      if (Authentication.isAuthenticated()) {
       $location.url('/');
      }
    }

    /**
    * @name register
    * @desc Register a new user
    * @memberOf thinkster.authentication.controllers.RegisterController
    */

    // this will store the status so I can access it in the HTML
    vm.error_status = ''

    function register() {
      // if t
      Authentication.register(vm.email, vm.password, vm.username).catch(function errorCallback(error){
        //save the result of the promise to a variable
        //var result = error.status;
        vm.error_status += error.status
        console.log(vm.error_status)
      })
    }

  }
})();

但是我的LoginController加载得很好：

/**
* Register controller
* @namespace thinkster.authentication.controllers
*/
(function () {
  'use strict';

  angular
    .module('thinkster.authentication.controllers', [])
    .controller('LoginController', LoginController);

  LoginController.$inject = ['$location', '$scope', 'Authentication'];

  /**
  * @namespace RegisterController
  */
  function LoginController($location, $scope, Authentication) {
    var vm = this;

    vm.login = login;

    activate();

    /**
    * @name register
    * @desc Register a new user
    * @memberOf thinkster.authentication.controllers.RegisterController
    */

    // this will store the status so I can access it in the HTML
    vm.error_status = ''


    function activate() {
      //If the user is authenticated, they should not be here

      if (Authentication.isAuthenticated()) {
        $location.url('/')
      }
    }

    function login() {
      Authentication.login(vm.email, vm.password)
    }
  }
})();

javascripts.html：

{% load compress %}
{% load staticfiles %}

{% compress js %}
<script type="text/javascript" src="{% static 'bower_components/jquery/dist/jquery.js' %}"></script>
<script type="text/javascript" src="{% static 'bower_components/bootstrap/dist/js/bootstrap.js' %}"></script>
<script type="text/javascript" src="{% static 'bower_components/bootstrap-material-design/dist/js/material.js' %}"></script>
<script type="text/javascript" src="{% static 'bower_components/bootstrap-material-design/dist/js/ripples.js' %}"></script>
<script type="text/javascript" src="{% static 'bower_components/underscore/underscore.js' %}"></script>

<script type="text/javascript" src="{% static 'bower_components/angular/angular.js' %}"></script>
<script type="text/javascript" src="{% static 'bower_components/angular-route/angular-route.js' %}"></script>
<script type="text/javascript" src="{% static 'bower_components/angular-cookies/angular-cookies.js' %}"></script>

<script type="text/javascript" src="{% static 'bower_components/ngDialog/js/ngDialog.js' %}"></script>
<script type="text/javascript" src="{% static 'lib/snackbarjs/snackbar.min.js' %}"></script>

<script type="text/javascript" src="{% static 'javascripts/thinkster.js' %}"></script>

<script type="text/javascript" src="{% static 'javascripts/thinkster.config.js' %}"></script>
<script type="text/javascript" src="{% static 'javascripts/thinkster.routes.js' %}"></script>
<script type="text/javascript" src="{% static 'javascripts/authentication/authentication.module.js' %}"></script>
<script type="text/javascript" src="{% static 'javascripts/authentication/services/authentication.service.js' %}"></script>
<script type="text/javascript" src="{% static 'javascripts/authentication/controllers/register.controller.js' %}"></script>
<script type="text/javascript" src="{% static 'javascripts/authentication/controllers/login.controller.js' %}"></script>
{% endcompress %}

路由工作正常，因为如果我将“ RegisterController”的名称更改为“ RegController”，那么该名称即出现在控制台日志中。有人可以在这里发现任何问题吗？

还有，有没有可以给我更详细地回溯我的文件出了问题的地方的应用程序或东西？

Answer 1

Charles Smith，您应该创建一个模块thinkster.authentication.controllers

例如

(function () {
   'use strict';
    angular.module('thinkster.authentication.controllers', []);
})();

，然后像下面这样向该模块添加新的婴儿推车：

(function () {
  'use strict';

 angular.module('thinkster.authentication.controllers')
        .controller('LoginController', LoginController);

 LoginController.$inject = ['$location', '$scope', 'Authentication'];

 [...]
)();

将数组添加为angular.module的第二个参数会触发重新创建该模块，但是您使用的是一个模块名称。

找不到我的角度控制器之一

1 个答案: