What is AngularJS€¦ · Angular Directives ng-app: directive initializes an AngularJS...

What is AngularJS

• MV* Javascript Framework maintained by

Google for Rich Web Application

Development.

• AngularJS extends HTML attributes

with Directives.

MVC

Model (Data)

Controller

(Logic)

View (UI) Notifies

Notifies Changes

Today’s Topics

Why use Angular?

Directives

Expressions

Module

Controller

$scope

Filters

Services

Why Angular ?

• Maintained by Google

• Free, no license

• Structured code

• Write less code

• Help available

• Unit Testing is easy

Other Javascript Frameworks

• BackboneJS

• EmberJS

Angular Directives

• ng-app: directive initializes an AngularJS

application.

• The ng-model directive binds the value of the

input field to the application variable name.

• ng-bind: This directive binds the AngularJS

Application data to HTML tags.

Expressions

Expressions allow you to execute some

computation in order to return a desired

value.

• {{ 1 + 1 }}

• {{ 946757880 | date }}

• {{ user.name }}

Angular module

AngularJS module defines AngularJS applications.

Initializes our app and register the modules on

which it depends

Angular Controller

Controls AngularJS applications.

JavaScript constructor function

currency filter lowercase uppercase orderBy

Services

• Services are javascript functions and are

responsible to do a specific tasks only.

• Singleton objects

• Inbuilt services: $http, $route, $window

Useful Links

• https://angularjs.org/

• http://campus.codeschool.com/courses/shapi

ng-up-with-angular-js/contents

• http://www.toptal.com/angular-js/a-step-by-

step-guide-to-your-first-angularjs-app

• https://github.com/raonibr/f1feeder-part1

Questions ?