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>
5 Answers 5
ng-app should be inside html or body, inside whichever tags you intend to use angular.
answered Mar 4, 2015 at 6:10
Aakash
6751 gold badge10 silver badges28 bronze badges
Sign up to request clarification or add additional context in comments.
1 Comment
user1799039
you can include angular.js toward the bottom of page or in the header section, both works
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';
});
answered Mar 4, 2015 at 6:12
Rajeshwar
2,5674 gold badges35 silver badges50 bronze badges
5 Comments
user1799039
Rajeshwar, for this simple example you don't have to create a controller. it started working by just placing the ng-app in html tag.
Rajeshwar
It is required, if you want to pre define your
name variable. Other wise, i understand its not required.user1799039
does it means, i can use "World" instead of name?
Rajeshwar
If you don't use a controller, then text box will not be populated with any value. what ever u enter in the text box will be shown in place of
{{name}}. But if you want to pre-populate the text box with some value you can define a controller and define variable name and u can assign some value. The the text box will be populated with the value u assigned to name variable in the controller.user1799039
thanks Rajeshwar! i implemented the same via controller. thanks for the info.
ng-app should be in html tag, not head.
answered Mar 4, 2015 at 6:09
Marko
1281 gold badge1 silver badge12 bronze badges
Comments
put ng-app in tag, not in head tag
answered Mar 4, 2015 at 6:11
Nitu Bansal
3,8563 gold badges20 silver badges24 bronze badges
Comments
Remove ng-app directives which is added to head tag and assign it to html
Comments
default