AngularJS First Application

Filters of AngularJS

An AngularJS First Application consists of following three important parts:
ng-app : Directive that defines and links an AngularJS application to HTML.
ng-model : Directive that binds the values of AngularJS application data to HTML input controls.
ng-bind : Directive that binds the AngularJS Application data to HTML tags.

Read Also: MVC Architecture of AngularJS

First Application Steps:

Add javascript framework using <Script> tag.

<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>

Define ng-app directive

<div ng-app="">
...
</div>

Define ng-model directive

<p>Name: <input type="text" ng-model="name"></p>

Bind the value of model using ng-bind directive.

<p>Hello <span ng-bind="name"></span>!</p>

Save the file into firstapps.html and run

<html>
<title>First Application</title>
<body>
<h1>My First Application</h1>
<div ng-app="">
<p>Name: <input type="text" ng-model="name"></p>
<p>Hello <span ng-bind="name"></span>!</p>
</div>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
</body>
</html>

For any types of queries, you can contact us on info@namasteui.com.

You may like:  AngularJS Controller

Leave a Reply

Your email address will not be published. Required fields are marked *