Let’s get started with Angular Js

Ever since , I have been associated with Angular JS, i have seen how Angular JS makes things so simple with its features like data binding, templating, routing etc.

Angular Js is a powerful JavaScript model –view- controller application framework. Which is mostly used for making client side application with use of JavaScript. It is build by Google. It extends our HTML elements to make our webpage more responsive. Applications written in Angular Js are cross browser compatible.

Benefits of Angular Js

1) Angular Js is a powerful JavaScript (MVC) framework.

2) Applications written in angular js are cross browser compatible.

3) Angular Js is open source, completely free to use.

4) Angular Js is a MVC framework to build large scale and best performance application.

5) Angular Js offers more functionality with less code.

6) Components build using angular js are unit testable.

Angular Js Components:

Modules:

Every application written in angular js is created using modules. Every module can have dependencies on other modules or it can be a single module as well.

It acts as a container for different part of an application for making code more reusable.

Controller:

Controller is a heart of an application. It is used to interact with view and model. Ng-controller directive is used to declare a controller.

Directives:

Angular Js extends html elements with new attributes called Directives.

Most directives in Angular Js starting with “ng-” prefix keyword where ng stands for Angular.

1) ng-app

The ng-app directive defines angular js application.

2) ng-init

The ng-init directive initialises angular js variables.

3) ng- model

The ng-model directive is used to bind value of application data to html control.

This directive is used for two way data-binding. It binds <input>, <select> or <textarea> elements to a particular property on the $scope object.

4) ng- bind

The ng-bind directive is used to binds the Angular JS Application data to HTML. It is used to update an element if the value of an expression changes.

5) ng-controller

The ng- controller attaches controller to MVC view.

6) ng-repeat

The ng-repeat directive repeats Html element once per each item in the particular collection.

Scope:

$Scope is a built in directive which contains application data and object. It manages controller and view. It is used to transfer data between controller and view and vice versa.

Routing

Angular js mainly used for single page application, it loads single Html page and dynamically change the page as per user interacts with the web Application.

Angular js supports SPA using ngRoute.

Template

It is a view with information from the controller and model. It can be a single file or can be multiple views in one page.

Pallavi Tapkir

Pallavi is well experienced in codeigniter and laravel, holding experience of 2 years.