Question

当我觉得我的单个控制器变得太大时，我现在正试图使用多个控制器。但是，当我导航到/signup时，由于某种原因无法找到我的UserController。我收到此错误：

错误：[ng：areq] Argument＆＃39; UserController＆＃39;不是一个功能，未定义

app.js

var app = angular.module('myApp', [
    'ui.router',
    'ngResource',
    'myApp.controllers',
]);

angular.module('myApp.controllers', []);

app.config(function($stateProvider, $urlRouterProvider, $httpProvider) {

  $stateProvider
    .state('signup', {
      url: '/signup',
      templateUrl: 'views/signup.html',
      controller: "UserController"
    });

});

我按此顺序包含.js个文件：

<script src="angular/controllers/mainCtrl.js"></script> //binded to body tag
<script src="angular/controllers/userCtrl.js"></script> //set in signup state
<script src="angular/app.js"></script>

UserController中

angular.module('myApp.controllers').controller('UserController', function () {

  //do stuff

});

我错过了什么？

Answer 1

让自己更轻松，创造更清晰的代码。

var app = angular.module('myApp', [
    'ui.router',
    'ngResource',
    'myApp.controllers',
])
.config(function($stateProvider) {
  $stateProvider
    .state('signup', {
      url: '/signup',
      templateUrl: 'views/signup.html',
      controller: "UserController"
    });
});

你没有使用$ urlRoutProvider和$ httpProvider所以为什么要注射它们？

到目前为止，Angular Modules一无所获。除了将第三方角度代码加载到您的应用程序中并在测试期间进行模拟。除此之外，没有理由在您的应用中使用多个模块。

要创建UserController，请执行

app.controller('UserController', function ($scope) {

  //do stuff

});

Answer 2

<script src="angular/controllers/mainCtrl.js"></script> //binded to body tag
<script src="angular/controllers/userCtrl.js"></script> //set in signup state
<script src="angular/app.js"></script>

在声明之前你无法使用模块。所以切换脚本顺序。

你应该坚持每个文件1个独立的模块声明，你就没事了，否则你必须管理脚本顺序。

Answer 3

在您拉入控制器子组件之前，必须首先声明您的app.js，如下所示：

<script src="angular/app.js"></script>
    <script src="angular/controllers/mainCtrl.js"></script> //binded to body tag
    <script src="angular/controllers/userCtrl.js"></script> //set in signup state

找不到Angularjs控制器

3 个答案: