Ziyad Mestour
Ziyad Mestour

Reputation: 97

AngularJs Error: [ng:areq]

I get an [ng:areq] Error, might be silly, but I didn't see through it.

Done some research found nothing helpful.

Demo code:

<!DOCTYPE html>
<html ng-app>
<head lang="en">
    <meta http-equiv="Content-Type" content="text/javascript; charset=utf-8" />
    <title>Angular Third Example</title>
        <script src="http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.3/angular.min.js"></script>
    <script>
        function NameCtrl($scope) {
          $scope.firstName = 'John';
          $scope.lastName = 'Doe';
        }
   </script>
</head>
<body ng-controller="NameCtrl">
    First Name: <input ng-model="firstName" type="text" />
    <br />

    Last Name: <input ng-model="lastName" type="text" />
    <br />

    Hello {{firstName}} {{lastName}}
</body>
</html>

Upvotes: 0

Views: 461

Answers (2)

cs1193
cs1193

Reputation: 1109

Please don't use this kind of declaration. Kindly use module based declaration.

ng-app does not recognize a name, which is needed.

var app = angular.module('app', []);
    app.controller('NameCtrl', ['$scope', function($scope) {
      $scope.firstName = 'John';
      $scope.lastName = 'Doe';
    }]);

Demo : http://plnkr.co/edit/LOHXR6DrH2o7YtfnCX8G?p=preview

Upvotes: 1

Wawy
Wawy

Reputation: 6269

Since angular 1.3.x you can't initialize a controller as a window function. Instead you need to define your app and controller explicitly:

<!DOCTYPE html>
<html ng-app="myApp">
<head lang="en">
    <meta http-equiv="Content-Type" content="text/javascript; charset=utf-8" />
    <title>Angular Third Example</title>
        <script src="http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.3/angular.min.js"></script>
    <script>
       angular.module('myApp', []).
       controller('NameCtrl', function($scope) {
          $scope.firstName = 'John';
          $scope.lastName = 'Doe';
       });
   </script>
</head>
<body ng-controller="NameCtrl">
    First Name: <input ng-model="firstName" type="text" />
    <br />

    Last Name: <input ng-model="lastName" type="text" />
    <br />

    Hello {{firstName}} {{lastName}}
</body>
</html>

Upvotes: 1

Related Questions