Building single page applications with angular.js
-
Upload
dieter-de-mesmaeker -
Category
Technology
-
view
1.030 -
download
2
description
Transcript of Building single page applications with angular.js
Building single page applications with Angular.js Dieter De Mesmaeker
What is Angular Js?
Open source javascript framework
Single page applications
Created by Misko Hevery at Google
Heavy focus on testing
Augmented HTML
Introduction
Introduction
Introduction
Introduction
Introduction
MVC
Concepts
ControllersSet up the initial state of the $scope object
ControllersAdd behaviour to a $scope object
ControllersDo NOT use controllers for DOM manipulation or presentation logic! (use Directives instead)
Only business Logic!
Why? Testability!
$scopeRefers to the application model
Glues the controller with its view
$scope inheritance
$scope
$scope
$scopeWhy child scope for ng-repeat?
ServicesView independent business logic
ServicesView independent business logic
ServicesFactory creates a single instance
Everything that is dependent on the service gets a reference to that instance
(Think of it as a singleton)
DirectivesExtending HTML
DOM Manipulation
Directives
DirectivesMore useful example
Directives
Two-way data binding
src: http://www.slideshare.net/cloudvis/angularjs-framework
Two-way data binding
src: http://www.slideshare.net/cloudvis/angularjs-framework
Two-way data binding
Classical template systems Angular templates
Dependency Injection
Dependency Injection
$location service
Navigating in Angular
ng-Route
Bootstrapping the Application
Hands on
Yeoman
Grunt
Bower
Depends on Node.js
Hands on
Step 1: Install node
http://lmgtfy.com/?q=install+node
Step 2: Install Yeoman
npm install -g yo
Hands on
Install the angular-generator
https://github.com/yeoman/generator-angular