gpt4 book ai didi

javascript - 出现错误 - "Argument ' myCtrl' 不是函数,未定义”

转载 作者:行者123 更新时间:2023-11-28 15:16:51 26 4
gpt4 key购买 nike

无法弄清楚我在哪里犯了错误。尝试遵循这个但没有任何运气 - How to find a reason AngularJS "Argument 'MyCtrl' is not a function, got undefined"

这是我的index.html 文件 -

<!DOCTYPE>
<html ng-app="myApp">
<head><title>Angular JS table sort and filter example </title>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<script src="http://code.angularjs.org/1.3.12/angular.js"></script>
<script src="http://code.angularjs.org/1.3.12/angular-resource.js"></script>
<script src="http://angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.11.0.js"></script>
<style>
.odd {
background-color: antiquewhite;
color: #008b8b;
}
td th {
height: 30px;
min-width: 100px;
}
thead {
background-color: darkgray;
color: white;
height: 30px;
}
</style>
</head>
</head>
<body ng-app="myApp">
<div ng-controller="myCtrl">
<h3>List students</h3>
<div class="container-fluid">
<pre>Click header link to sort, input into filter text to filter</pre>
<hr />
<table class="table table-striped">
<thead>
<tr>
<th>
<a href="" ng-click="order('name')">Name</a>
</th>
<th><a href="" ng-click="order('age')"> Age</a> </th>
<th><a href="" ng-click="order('gender')">Gender</a> </th>
</tr>
</thead>
<tbody>
<tr>
<td> <input type="text" ng-model="search.name" /></td>
<td> <input type="text" ng-model="search.age" /> </td>
<td><input type="text" ng-model="search.gender" /> </td>
</tr>
<tr ng-repeat="user in students | orderBy:predicate:reverse | filter:paginate| filter:search" ng-class-odd="'odd'">
<td>{{user.name}}</td>
<td>{{user.age}}</td>
<td>{{user.gender}}</td>
</tr>
</tbody>
</table>
<pagination total-items="totalItems" ng-model="currentPage"
max-size="5" boundary-links="true"
items-per-page="numPerPage" class="pagination-sm">
</pagination>
</div>
</div>
<script src="controllers/controller.js"></script>
</body>
</html>

controller.js 文件 -

var app = angular.module('myApp',['ui.bootstrap', 'ngResource']);  
app.controller('myCtrl', function ($scope) {
$scope.predicate = 'name';
$scope.reverse = true;
$scope.currentPage = 1;
$scope.order = function (predicate) {
$scope.reverse = ($scope.predicate === predicate) ? !$scope.reverse : false;
$scope.predicate = predicate;
};
$scope.students = [
{ name: 'Kevin', age: 25, gender: 'boy' },
{ name: 'John', age: 30, gender: 'girl' },
{ name: 'Laura', age: 28, gender: 'girl' },
{ name: 'Joy', age: 15, gender: 'girl' },
{ name: 'Mary', age: 28, gender: 'girl' },
{ name: 'Peter', age: 95, gender: 'boy' },
{ name: 'Bob', age: 50, gender: 'boy' },
{ name: 'Erika', age: 27, gender: 'girl' },
{ name: 'Patrick', age: 40, gender: 'boy' },
{ name: 'Tery', age: 60, gender: 'girl' }
];
$scope.totalItems = $scope.students.length;
$scope.numPerPage = 5;
$scope.paginate = function (value) {
var begin, end, index;
begin = ($scope.currentPage - 1) * $scope.numPerPage;
end = begin + $scope.numPerPage;
index = $scope.students.indexOf(value);
return (begin <= index && index < end);
};
});

最佳答案

该错误与应用程序的初始化方式和双 ng-app 有关。您可以通过手动引导 angularjs 轻松验证这一点:

当您删除 ng-app 并在 controllers/controller.js 底部添加以下代码段时,您的脚本可以正常工作:

angular.element(文档).ready(function() {
angular.bootstrap(文档, ['myApp']);
});

关于javascript - 出现错误 - "Argument ' myCtrl' 不是函数,未定义”,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33477932/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com