AngularJS

Question

这是我的看法index.html:

<!DOCTYPE html>
<html ng-app>
<head>
    <title>Iterating Over Data</title>
    <link href="styles.css" rel="stylesheet" type="text/css" />
</head>
<body ng-controller="CustomersController">
    <h2>Customers</h2>
    Filter: <input type="text" ng-model="customerFilter.name">
    <br><br>
    <table>
        <tr>
            <th ng-click="doSort('name')">Name</th>
            <th ng-click="doSort('city')">City</th>
            <th ng-click="doSort('orderTotal')">Order</th>
            <th ng-click="doSort('joined')" >Joined</th>
        </tr>
        <tr ng-repeat="cust in customers | filter:customerFilter | orderBy:sortBy:reverse">
            <td>{{ cust.name | uppercase }}</td>
            <td>{{ cust.city | lowercase }}</td>
            <td>{{ cust.orderTotal | currency }}</td>
            <td>{{ cust.joined | date }}</td>
        </tr>
    </table>
    <br>
    <span>Total customers: {{ customers.length }}</span>
    <script src="angular.js"></script>
    <script src"app/controllers/customersController.js"></script>
</body>
</html>

这是我的控制器：

function CustomersController($scope) {
  $scope.sortBy = 'name';
  $scope.reverse = false;

  $scope.customers = [{
    joined: '2012-12-02',
    name: 'Dylan',
    city: 'Buffalo',
    orderTotal: 9.521
  }, {
    joined: '1932-12-02',
    name: 'Pete',
    city: 'Detroit',
    orderTotal: 111.521
  }, {
    joined: '1967-11-04',
    name: 'Sampress',
    city: 'Kanas City',
    orderTotal: 92.521
  }];
  $scope.doSort = function(propName) {
    $scope.sortBy = propName;
    $scope.reverse = !$scope.reverse;
  };
}

当我在浏览器中打开 index.html 文件时，我继续得到

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

我的所有文件都在正确的位置，我什至尝试将其添加为普通脚本标签，但仍然出现相同的错误，不确定我在这里做错了什么。

Answer 1

您可能没有在全局命名空间中定义您的控制器，或者没有足够早地定义您的控制器。

通过查看 window.CustomersController 检查您是否在全局命名空间中定义控制器。 window.CustomersController应该是你的控制器函数。如果您没有在全局命名空间中定义控制器，请尝试添加：

window.CustomersController = CustomersController;

如果您没有尽早定义控制器，请确保您没有在加载事件之后、DOM 就绪事件之后定义控制器。请注意，此 JS Fiddle 仅在以下情况下有效"no wrap in - " 或 "no wrap in - " 被选中。如果选择 "onload" 或 "onDOMready" 则不起作用。

Alternatively，您可以为您的应用命名：

<html ng-app="foo">
</html>

angular.module("foo", [])
.controller("CustomersController", function CustomersController() {});

Answer 2

试试这个

<html ng-app="App">

控制器

myApp = angular.module('App',[]);
myApp.controller('CustomersController',['$scope',function($scope) {
//Your code here

}]);

AngularJS - Error: [ng:areq] Argument 'CustomersController' is not a function, got undefined

AngularJS - Error: [ng:areq] Argument 'CustomersController' is not a function, got undefined

angularjs-controller