Hello angular

523 views

Published on

slides for introductory hello-world talk at first angularjs-vienna meetup

Published in: Technology, Education
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
523
On SlideShare
0
From Embeds
0
Number of Embeds
13
Actions
Shares
0
Downloads
6
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide
  • manfred, freelance coder and bar-owner
    php since 95,
  • http://jsfiddle.net/rvFE8/
  • http://jsfiddle.net/rszmu/
    A few interesting thingsBind with no classes, no IDs in HTMLNo register eventshello_controller.js is plain JavaScript class Auto inject $scopeAuto init HelloController
  • Experiences from building large web applications like Gmail, Maps, Calendar ...
  • http://jsfiddle.net/werkzeugh/68swX/2/
  • http://jsfiddle.net/werkzeugh/68swX/2/
  • http://jsfiddle.net/werkzeugh/68swX/2/
  • http://jsfiddle.net/werkzeugh/68swX/2/
  • Hello angular

    1. 1. AngularJS Meetup 01/23/2014 @sektor5 8 months with AngularJS by Manfred Wuits manfred@werkzeugH.at
    2. 2. Hello world: <!doctype html> <html> <head> <script src=“angular.min.js" /> </head> ! <body ng-app> <input type="text" ng-model="userName" /> <h3>Hello {{userName}}</h3> </body> ! </html> http://jsfiddle.net/rvFE8/
    3. 3. Hello controllers: ! function MainCtrl($scope) { $scope.userName = 'world'; // Model initialisation $scope.greet = function() { // Event handler $scope.userName = $scope.userName.toUpperCase(); $scope.message = "Hello " + $scope.userName; } } http://jsfiddle.net/rszmu/
    4. 4. ! ! ➜ Open Source Javascript Framework ! ❖ MVC architecture (Single-Page-Apps) ❖ Data binding ❖ Client side templates ❖ Dependency injection
    5. 5. a tiny demo-app ! ▸ http://jsfiddle.net/werkzeugh/68swX/3/
    6. 6. some Showcases ➜ sorry, mostly on intranet and dev-servers, no links :(
    7. 7. THANKS ! manfred@werkzeugH.at twitter/ADN: werkzeugh

    ×