AngularJS новичок: ng-контроллер не работает
Я просто пытаюсь получить мою голову вокруг основы в AngularJS. Я попытался написать простое приложение MVC, но контроллер, похоже, не работает. Файл может найти угловой lib просто найти, я уже проверил это, исключив 'ng-controller'.
<!DOCTYPE html>
<html ng-app>
<head>
<script src='js/lib/angular.js'></script>
<script>
// controller
function MyFirstCtrl($scope) {
// model
var employees = ['Christopher Grant', 'Monica Grant', 'Christopher
Grant', 'Jennifer Grant'];
$scope.ourEmployees = employees;
}
</script>
</head>
<body ng-controller='MyFirstCtrl'>
<!-- view -->
<h2>Number of employees: {{ourEmployees.length}}</h2>
</body>
</html>
Править: В журнале ошибок записано следующее:
Uncaught SyntaxError: Unexpected token ILLEGAL , line 9
Uncaught SyntaxError: Unexpected token { , line 19
Error: [ng:areq] Argument 'MyFirstCtrl' is not a function, got undefined
EDIT2: я изменил код на этот:
<!DOCTYPE html>
<html ng-app='MVCExample'>
<head>
<script src='js/lib/angular.js'></script>
<script>
var app = angular.module('MVCExample', []);
// controller
app.controller("MyFirstCtrl", function($scope) {
// model
var employees = ['Christopher Grant', 'Monica Grant', 'Christopher Grant', 'Jennifer Grant'];
$scope.ourEmployees = employees;
});
</script>
</head>
<body ng-controller='MyFirstCtrl'>
<!-- view -->
<h2>Number of employees: {{ourEmployees.length}}</h2>
</body>
</html>
Также оказалось, что массив' employees', который у меня был, был незаконным, так как у меня была одна запись строки, разделенная на две линии. Вышеуказанные работы. Книга для начинающих, которую я использую, должно быть, устарела, что прискорбно.
3 ответа:
Если вы используете AngularJS
1.3+
версии, то вы не можете объявить глобальный контроллер, как выше вы делаете.Вы должны инициализировать, как показано ниже.
<div ng-app="appname" ng-controller="MyFirstCtrl"> var app = angular.module('appname', []); app.controller('MyFirstCtrl',function(){ //controller code here });
Я не вижу, как вы инициализируете приложение angularjs, не знаю, включено ли это уже в связанный файл js, но в принципе, у вас должно быть что-то вроде этого:
var app = angular.module("appName", []).controller("ControllerName", function ($scope){ //your controller code here });
И затем иметь в своем HTML-коде что-то вроде:
<html ng-app="appName">