Question

我在AngularJS 1中尝试新字段，

我试过按照Dan Wahlin的视频教程“AngularJS Fundamentals In 60-ish Minutes”一切都很好，但我不知道问题出在哪里，当我在Chrome中检查我的控制台时，通知错误显示“名称'SimpleController'未注册“

这里是我的代码：

<html ng-app="testAppApp">
<head>
...........
...........
</head>
<body>
<div ng-controller="SimpleController">
Search <input type="text" ng-model="name" />

<ul>
<li ng-repeat="cust in customers | filter:name | orderBy:'Name'">   
{{cust.Name}} - {{cust.City}} - {{cust.Age}}</li>
</ul> 

</div> 
<script src="bower_components/angular/angular.js"></script>

这里我的控制器位于角度脚本

之下

<script>
var testAppApp = angular.module('testAppApp', []);

testAppApp.controller('SimpleController', function ($scope) {
        $scope.customers = [ 
                {Name: 'Tatiana', City: 'Troy Village', Age: '23'},
                {Name: 'Drew', City: 'Enor City', Age: '28'},
                {Name: 'Barry', City: 'Ville', Age: '27'}
                ];
        });
</script>
</body>
</html>

我使用最新的angularJS 1.x（1.6.2），感觉我已经按照教程正确使用了。但我不知道为什么我的脚本错误。

Answer 1

设置控制器路径，如;

<script src="js/controller/SimpleController.js" type="text/javascript"></script>

Answer 2

这是因为您在加载前使用angular。在angular.min.js部分

中加载head

试试这个

＆＃13;

<!DOCTYPE html>
<html ng-app="testAppApp">
<head>
	<title></title>
	<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.1/angular.min.js"></script>
	<script type="text/javascript">
		

		var testAppApp = angular.module('testAppApp', []);

		testAppApp.controller('SimpleController', function ($scope) {
			$scope.customers = [ 
			{Name: 'Tatiana', City: 'Troy Village', Age: '23'},
			{Name: 'Drew', City: 'Enor City', Age: '28'},
			{Name: 'Barry', City: 'Ville', Age: '27'}
			];
		});
	</script>
</head>
<body>
	<div ng-controller="SimpleController">
		Search <input type="text" ng-model="name" />

		<ul>
			<li ng-repeat="cust in customers | filter:name | orderBy:'Name'">   
				{{cust.Name}} - {{cust.City}} - {{cust.Age}}</li>
			</ul> 

		</div> 

	</body>
	</html>

＆＃13;

Answer 3

您的代码是正确的Jsfiddle link using angualr 1.4.8

<强> HTML

  <div ng-app='testAppApp'>

  <div ng-controller="SimpleController">
    Search
    <input type="text" ng-model="name" />

    <ul>
      <li ng-repeat="cust in customers | filter:name | orderBy:'Name'">
        {{cust.Name}} - {{cust.City}} - {{cust.Age}}</li>
    </ul>

  </div>
  </div>

<强>的js

  var testAppApp = angular.module('testAppApp', []);
  testAppApp.controller('SimpleController', function ($scope) {
          $scope.customers = [ 
                  {Name: 'Tatiana', City: 'Troy Village', Age: '23'},
                  {Name: 'Drew', City: 'Enor City', Age: '28'},
                  {Name: 'Barry', City: 'Ville', Age: '27'}
                  ];
          });

希望这会对你有所帮助

Answer 4

在head部分添加以下代码，确保您的互联网正常运行。

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>

或者将angular.js包含在完整路径中

<script src="Content/js/bower_components/angular/angular.js"></script>

没有注册具有特定名称的角度控制器

4 个答案: