Angular Examples with Source Code for web Developers

Today AngularJS is one of the most popular JS Framework. It was developed & maintained by Google. AngularJS popularity is behind its key features. Some of the advanced key features of AngularJS are Model, View, Controller, Search Filter, Directives, One way & Two way Data binding etc. Are you going to Get Started with AngularJS programming. If so this session can very helpful for you. In this session we are presenting the most frequently used in-built directives of AngularJS. To make your learning easier here we are also sharing easy examples.

Frequently used in-built AngularJS Directives

ng-repeat - To run a loop in HTML AngularJS provides ng-repeat directive. ng-repeat works like a for loop. Let's take a case where you want to show list of Country names in a Combo box. In this case if you are using HTML ul li element then to show list of values in Combo box you can apply ng-repeat to li elements.

ng-repeat with Search filter - As we discussed above AngularJS is rich with powerful Search facility. To implement search we don't required to write our own functions or methods. By simply calling filter with any data bind directive we can easily implement Search facility.

ng-view - ng-view is like a div or span control of HTML. Generally during we design a Single Page Application (SPA) ng-view comes into picture. Let's i have a Company website. I want to update contents in content area depending upon the tab click. In this case ng-view act like a Container.

ng-show & ng-hide - These directives we used to show or hide contents. ng-show and ng-hide works similar.

ng-model - In AngularJS ng-model is used to identify a Control for the use in AngularJS Scope. This is one type of in-built model for Controls.

ng-switch - Every programming language provides Switch case after if else. For more number of Conditional statements Switch case renders better performance. In AngularJS ng-switch is the directive which we used to handle switch case. Like default case in Angular we use ng-switch-default. Hope the example can describe you more better.

ng-options - During we display list of records generally we use HTML Select Box. In this example I am binding JSON formatted data using ng-options directives from AngularJS.

After these Directives AngularJS provides many more in-built directives. You can also create your own directive in Angular.

Developed by https://jharaphula.com/category/programming-solutions/

jharaphula/AngularJS-easy-Examples

ErrorLooks like something went wrong!

About

Topics

Resources

Uh oh!

Stars

Watchers

Forks

Releases

Packages 0

Languages

Error
Looks like something went wrong!

Packages