it-swarm.com.ru

Начинающий AngularJS: ng-контроллер не работает

Я просто пытаюсь разобраться с основами AngularJS. Я пытался написать простое приложение MVC, но контроллер, похоже, не работает. Файл может найти angular 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>

Также оказалось, что массив "сотрудники", который у меня был, был недопустим, поскольку у меня была одна строковая запись, разделенная на две строки. Выше работает. Книга для начинающих, которую я использую, должна быть устаревшей, что вызывает сожаление.

6
BrianRT

Если вы используете версии angularjs 1.3+, вы не можете объявить глобальный контроллер, как описано выше.

Вы должны инициализировать, как показано ниже.

<div ng-app="appname" ng-controller="MyFirstCtrl">
var app = angular.module('appname', []);
app.controller('MyFirstCtrl',function(){
   //controller code here
});
11
Vineet

Я не вижу, как вы инициализируете приложение angularjs, не знаю, включено ли оно уже в файл js, который вы связали, но в принципе у вас должно быть что-то вроде этого:

var app = angular.module("appName", []).controller("ControllerName", function ($scope){
  //your controller code here
});

И тогда в вашем HTML-коде есть что-то вроде:

<html ng-app="appName">
2
Luis Delgado