1024px-Flatirons_Winter_Sunrise_edit_2

AngularJS is the one of the most powerful framework present for front end developing. You can develop a complete application with it. It features less boilerplate code. AngularJS is maintained by Google.

In today’s lesson I will show you a basic example of AngularJS and in this example you can observe the effectiveness of this framework.

Basics of Getting Started

AngularJS is a JavaScript framework. It is a library written in JavaScript. The first step you need to download or link to the AngularJS library.

In my case I am linking to the AngularJS URL https://ajax.googleapis.com/ajax/libs/angularjs/1.4.1/angular.min.js

Or you can download it from www.angularjs.org.

Good thing is you can embed it in your existing HTML code.

The ng-app directive states an AngularJS application. The ng-app directive tells AngularJS that the <div> element is the “owner” of an AngularJS application.

The ng-model directive binds the value of the input field to the application variable name. AngularJS starts automatically when the web page has loaded.

[cta id=”3157″ align=”none”]

Take a look at this example and see the magic:

The first thing you’ll notice in this template is the use of expressions (“{{“ and “}}”) to return variable values. In AngularJS, expressions allow you to execute some computation in order to return a desired value. Ultimately, they’re full blown JavaScript expressions.

In this example, {{name}} will return the value of input field having ng-model=”name”.

Looking to learn more about AngularJS for your team? Check out our custom group training options today.