Top Banner
AngularJS Presented by
24
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
Page 1: Advancio, Inc. Academy: AngularJS

AngularJS

Presented by

Page 2: Advancio, Inc. Academy: AngularJS

http://angularjs.org/

Page 3: Advancio, Inc. Academy: AngularJS

Agenda

AngularJS Features Getting Started Directives, Filters and Data Binding Views, Controllers and Scope Modules and Routes

Page 4: Advancio, Inc. Academy: AngularJS

Getting Started

Page 5: Advancio, Inc. Academy: AngularJS

Single Page Application (SPA)

Page 8: Advancio, Inc. Academy: AngularJS

Directives, Filters&

Data Binding

Page 9: Advancio, Inc. Academy: AngularJS

What are Directives ?

They Teach HTML new tricks !

Page 10: Advancio, Inc. Academy: AngularJS

Using Directives and Data Binding

Directive

Data Binding Expression

Directive

Page 11: Advancio, Inc. Academy: AngularJS

Iterating with the ng-repeat Directive

Page 12: Advancio, Inc. Academy: AngularJS

Using Filters

Page 13: Advancio, Inc. Academy: AngularJS

Views, Controllers and Scope

Page 14: Advancio, Inc. Academy: AngularJS

View, Controllers and Scope

View Controller$scope

$scope is the “glue” (ViewModel)between a controller and a view

Page 15: Advancio, Inc. Academy: AngularJS

Creating a View and Controller

Basic controller

Page 16: Advancio, Inc. Academy: AngularJS

Creating a View and Controller

$scope injected dynamically Access $scope

Page 17: Advancio, Inc. Academy: AngularJS

Modules, RoutesAnd Factories

Page 18: Advancio, Inc. Academy: AngularJS

Module

Config

Routes

View Controller

Directives *Factory

$scope

Page 19: Advancio, Inc. Academy: AngularJS

Modules are Containers

Page 20: Advancio, Inc. Academy: AngularJS

Creating a ModuleWhat’s the Array

for ?

Module that’s demoApp depends

on

Page 21: Advancio, Inc. Academy: AngularJS

Creating a Controller in a Module

Define a ModuleDefine a Controller

Page 22: Advancio, Inc. Academy: AngularJS

The Role of Routes

Page 23: Advancio, Inc. Academy: AngularJS

Defining Routes

Define Module Routes