Include AngularJS
We include the AngularJS JavaScript file in the HTML page so that we can use it:
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.17/angular.min.js"></script>
</head>
Point to AngularJS app
Next, it is required to tell which part of HTML contains the AngularJS app. You can do this by adding the ng-app attribute to the root HTML element of the AngularJS app. You can either add it to html element or body element as shown below:
<body ng-app="myapp">
</body>
View
The view is this part:
<div ng-controller="HelloController">
<h2>Welcome {{ helloTo.Title }} to the world of tutorial point</h2>
</div>
ng-controller tells AngularJS which controller to use with this view. helloTo.title tells AngularJS to write the model value named helloTo.title in HTML at this location.
Controller
<script>
angular.module("myapp",[])
.controller("HelloController",function($scope)
{
$scope.helloTo=[];
$scope.helloTo.Title="AngularJS";
});
</script>
We include the AngularJS JavaScript file in the HTML page so that we can use it:
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.17/angular.min.js"></script>
</head>
Point to AngularJS app
Next, it is required to tell which part of HTML contains the AngularJS app. You can do this by adding the ng-app attribute to the root HTML element of the AngularJS app. You can either add it to html element or body element as shown below:
<body ng-app="myapp">
</body>
View
The view is this part:
<div ng-controller="HelloController">
<h2>Welcome {{ helloTo.Title }} to the world of tutorial point</h2>
</div>
ng-controller tells AngularJS which controller to use with this view. helloTo.title tells AngularJS to write the model value named helloTo.title in HTML at this location.
Controller
<script>
angular.module("myapp",[])
.controller("HelloController",function($scope)
{
$scope.helloTo=[];
$scope.helloTo.Title="AngularJS";
});
</script>
No comments:
Post a Comment