Sunday, July 30, 2017

What is ng-repeat directive?

It is a directive which repeats HTML elements in a collection, provided that collection must be an array. So, basically we can say it is mainly used for looping data same like for,while,foreach etc.   

Example:


Output:



Wednesday, July 19, 2017

What is ng-bind directive?

The ng-bind directive binds the model property. The ng-bind attribute tells AngularJS to replace text content of the specified HTML element with the value of given expression, and update the text content when the value of that expression changes.   
  

Example:





Output :


In above example, ng-bind directive bind the value of ng-model property “name” to the <span>.The value of “name” property will enter in textbox.

Tuesday, July 18, 2017

What is ng-model directive?

The primary purpose of this directive is bind the “View” to the “model”. We can bind the HTML controls (input, select, text area) value to application data.

One way data binding

One way data binding means that, it bind the data model to the view. Show figure in below. 


Example: 



















If the code is executed successfully, the following output will be shown below.



Two way data binding

The binding goes both ways.If the user changes the value inside the input field,the AngularJs property will also change its value.Show figure in below.



Example:



Output:





Monday, July 17, 2017

What is ng-init directive?

Ng-init directive used to initialize application data. Sometimes you may require some local data for your application, this can be done with the ng-init directive.  

How to use ng-init directive  

In this example, we are going to create a variable called “Name” using ng-directive and display the value of variable on the page.


Output:





In above example, we initialized variable of string. These variable can be used anywhere inside <div> elememt.  

Sunday, July 16, 2017

What is ng-app directive?

It is represent angular JS application and root element of the application. It initializes the angular JS framework automatically. It will first check the ng-app directive in HTML document if it is found then complete document is loaded.

Example:




 Output:

In above example, ng-app directive is placed in the div element whose id div_Id.Therefor, AngularJs will only compile div_Id and its child element. It will not compile the parent or sibling elements of div_Id.

The following figure illustrates the above example.




Wednesday, July 12, 2017

What is angularjs directives?

Angular js directives means that it extends the HTML. These are special attributes starting with ng-prefix where ng stand for angular. AngularJS includes various built-in directives. In addition to this, you can create custom directives for your application. Discuss some important directives of angular js.

  • ·         Ng-app
  • ·         Ng-init
  • ·         Ng-model
  • ·         Ng-controller
  • ·         Ng-bind
  • ·         Ng-repeat
  • ·         Ng-show
  • ·         Ng-readonly
  • ·         Ng-disabled
  • ·         Ng-if
  • ·         Ng-click








What is angularjs modules?

An Angular js modules represent an application and it is a container for different part of application. It is a main() method in your application. Module is created by using the angular js function like:

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

<script>
var app = angular.module("myApp", []); 

</script>

You will notice that angular.module("myApp", []) are having two parameters.
The first parameter represents the name of module and the second parameter represents the dependency which are associated with that module.

Note: A module can depend on another module also