CODEWITHSUNDEEP
angularjs
user1799039
user1799039

Reputation: 21

Angular JS - Basic data binding not working

i'm new to angular, so started with very basic example, but this is also not working. so please help me out. below code should write the content of textbox to the page.

<html xmlns="http://www.w3.org/1999/xhtml">
<head ng-app>
    <title></title>
</head>
<body>
    <div class="container">
        Name: <input type="text" ng-model="name" />{{name}}
    </div>
    <script src="/script/angular.js" type="text/javascript"></script>
</body>
</html>

Upvotes: 1

Views: 114

Answers (5)

Prasad Sonawane
Prasad Sonawane

Reputation: 80

Remove ng-app directives which is added to head tag and assign it to html

Upvotes: 0

Rajeshwar
Rajeshwar

Reputation: 2529

In your code ng-app scope is ending with in head tags only. You haven't used ng-app at root level. You can use it at html or body or main div tag level. And there is no ng-controller in your markup. Of course you can also configure controller through js file also. You use below code.

HTML

<html ng-app="plunker">

<head>
  <script data-require="[email protected]" src="https://code.angularjs.org/1.3.14/angular.js" data-semver="1.3.14">    </script>
  <script src="app.js"></script>
</head>

<body ng-controller="MainCtrl">
  <div class="container">
      Name: <input type="text" ng-model="name" />{{name}}
  </div>
</body>

</html>

JS

var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope) {
  $scope.name = 'World';
});

Upvotes: 1

Nitu Bansal
Nitu Bansal

Reputation: 3856

put ng-app in tag, not in head tag

Upvotes: 0

Aakash
Aakash

Reputation: 675

ng-app should be inside html or body, inside whichever tags you intend to use angular.

Upvotes: 1

Marko
Marko

Reputation: 128

ng-app should be in html tag, not head.

Upvotes: 0

Related Questions