Best Tutorial AngularJS

October 21, 2016 Narayan Rajak Tutorials 0

This tutorial is specially designed to help  learn AngularJS as quickly and efficiently as possible.

First, learn the basics of AngularJS: directives, expressions, filters, modules, and controllers.

Then learn everything else need to know about AngularJS:

Events, DOM, Forms, Input, Validation, HTTP, and more.

  • AngularJS extends HTML with new attributes.
  • AngularJS is perfect for Single Page Applications (SPAs).
  • AngularJS is easy to learn.

Before study AngularJS  a basic understanding of:

  • HTML
  • CSS
  • JavaScript

History of AngularJS

  • AngularJS version 1.0 was released in 2012.
  • Misko Hevery, a Google employee, started to work with AngularJS in 2009.
  • The idea turned out very well, and the project is now officially supported by Google.

Introduction

AngularJS is JavaScript Frame work. It can be added to an HTML page with a <script> tag.

AngularJS extends HTML attributes with Directives, and binds data to HTML with Expressions.

AngularJS is a JavaScript framework. Because it  is a library written in JavaScript. AngularJS is distributed as a JavaScript file, and can be added to a web page with a script tag:

 

AngularJS binds data to HTML using Expressions.

  • AngularJS expressions can be written inside double braces: {{ expression }}.
  • AngularJS expressions can also be written inside a directive: ng-bind="expression".
  • AngularJS will resolve the expression, and return the result exactly where the expression is written.

AngularJS expressions are much like JavaScript expressions:

 

Now discuss about the differentiate between AngularJS expression and JavaScript expression.
  • Like JavaScript expressions, AngularJS expressions can contain literals, operators, and variables.
  • Unlike JavaScript expressions, AngularJS expressions can be written inside HTML.
  • AngularJS expressions do not support conditionals, loops, and exceptions, while JavaScript expressions do.
  • AngularJS expressions support filters, while JavaScript expressions do not.

AngularJS Module: An AngularJS module defines an application. The module is a container for the different parts of an application. The module is a container for the application controllers. Controllers always belong to a module.

AngularJS Directive:  An directives are markers on a DOM element that tell AngularJS HTML compiler to attach a specified behavior to that DOM element or even to transform the DOM element. A set of these directives built-in, like ng-Bind, ng-Model, and ng-Class. Much like create controllers and services, you can create your own directives for Angular to use.

In addition to all the built-in AngularJS directives, you can create your own directives.

  • New directives are created by using the .directive function.
  • To invoke the new directive, make an HTML element with the same tag name as the new directive.