Thread Rating:
  • 0 Vote(s) - 0 Average
  • 1
  • 2
  • 3
  • 4
  • 5
Thread Contributor: Ravishankar ChavarePart 5-Extends AngularJS in Html
#1
Hello friends i have already posted how to install angular  JS in local system if you not read yet read Here


Now i guess that you already learn the basic of AngularJS today i am going to teach you how to extends AngularJS in html

Code:
<!DOCTYPE html>
<html>
<head>
    <title>basic angular js</title>
    <script src="angular.min.js"></script>
</head>
<body>
<div ng-app="">
<p>Alias:<input type="text" name="name" ng-model="name"></p>
<p ng-bind="name">{{name}}</p>
</div>
</body>
</html>

OUTPUT:

[Image: Bm1Xjj2.png]


Description:

1.ng-app:

- ng-app mostly the name of the angular JS application.
-The ng-app directive designates the root element of the application and is typically placed near the root element of the page.Example on <body> or <html> tag.
-Only one ng-app per html document allowed.
-AngularJS application cannot be nested withing each other


2.ng-model:

-ng-model directive binds the value of html controls such as input,selection,textarea to application data
-registering control with its parents
-provides validation behavior example:required,email,number,url or others

3.ng-bind:

-This will bind actual application data to html view means you can get input values from api and using ng-bind you can set that API data into html view.
-you don't use ng-bind directly, but instead you use the double curly markup like {{ expression }} which is similar but less verbose.



Part 1-Introduction of AngularJS
Part 2- AngularJS Installation
Part 3-MVC in AngularJS
Part 4- MVC AngularJS controller defined in another file
Reply


Forum Jump:


Users browsing this thread: 1 Guest(s)