Angularjs routing tutorial

AngularJS Routing: In AngularJS we can create Single Page Application which loads a single HTML page via multiple views i.e. dynamically updates that page as the user interacts with the web app. AngularJS provides ng-view and ng-template directives and $routeProvider services to achieve this. ng-view directive: It creates a place holder where a corresponding view … Read more

Angularjs ajax tutorial

In AngularJS, we can send Ajax request in several ways: 1. AJAX calls via the $http service. 2. JSONP calls via the http service. 3. REST type calls.   We are explaining here ajax call via the $http service. AngularJS provides the $http service for reading data from remote servers. Let us discuss $http service … Read more

Angularjs custom service tutorial

AngularJS services: In AngularJS, a service is a function which is used to perform specific task. AngularJS provides many inbuilt services like $http, $route, $window, $location etc. Note: Inbuilt services are prefixed with $ symbol. Ways to create a custom service: 1. factory 2. service Example: <html>   <head> <title>AngularJS Custom Services Example</title> <script src … Read more

Angularjs internationalization tutorial

Internationalization: Internationalization is the process of designing a software application in such a way so that it can potentially be adapted to various languages and regions without changes. AngularJS Internationalization: AngularJS provides the inbuilt internationalization for three types of filters currency, date and numbers. We only need to tell AngularJS what locale to use when … Read more

Angularjs dependency injection tutorial

Dependency Injection (DI): Dependency Injection (DI) is a design pattern that implements inversion of control principle for resolving dependencies. It allows a programmer to remove hard coded dependencies so that the application becomes loosely coupled and extendable AngularJS dependency injection: AngularJS provides also provides the mechanism of Dependency Injection with the help of following core … Read more

Angularjs include html tutorial

Angularjs include html: HTML does not support embedding html pages within html page. But we can achieve this functionality using AngularJS. AngularJS provides the ng-include directive to embed HTML pages within a HTML page. Example: testable.htm <p>Students with country name:</p> <table> <tr> <th>Name</th> <th>Country</th> </tr>   <tr ng-repeat = "student in students"> <td>{{ }}</td> … Read more

Angularjs custom validations tutorial

Angularjs custom validations: AngularJS provides the facility to create the custom validations. We have to add a new directive to our application and provide the validation logic inside a function with certain specified arguments. Example Explanation: The ng-app directive initializes the application. We create a custom directive testDirective. We define validation logic inside testValidation function … Read more

Angularjs custom filters tutorial

Angularjs custom filters: AngularJS provides the facility to create the custom filters. Custom filters are created using “filter” function. Example Explanation: The ng-app directive initializes the application. We create a testFilter which reverse the string and capitalize the first letter. Example: <!DOCTYPE html> <html> <script src=""> </script>   <body> <div ng-app="testApp" ng-controller="appCtrl"> Welcome to {{ … Read more

Angularjs custom directives tutorial

Angularjs custom directives: AngularJS provides the facility to create the custom directives. Custom directives extends the functionality of HTML. Custom directives are created using “directive” function. AngularJS simply replace the element with custom directive for which it actsivated. Important points: If custom directive name consist of two or more words like testDirective then when invoking … Read more

Angularjs form validation tutorial

Validation: Validation is a process of checking something against a standard. AngularJS validation: AngularJS provides client-side form validation. AngularJS provides the facility to get the current state of form and input fields. Input States: $untouched: The specified field has not been touched yet. Value can be true or false. $touched: The specified field has been … Read more