Takeaway from AngularJS 101 – Everything you need to know to get started by Stéphane Bégaudeau

AngularJS 101 – Everything you need to know to get started by Stéphane Bégaudeau is another deck of slides about AngularJS I watched today. It’s to improve my understanding of how to use AngularJS in my current and future projects. It’s the front-end JavaScript framework for the project I’m in after all so to apply it well I’m watching slides on Slideshare and taking notes to keep the lessons last longer.

The slide deck was exactly what I needed – fully packed with enough in-depth information on Angular components: controllers, services, directives, scopes, filters, and modules.

REMEMBER Never ever manipulate the DOM from the controller

Directives

  • Declarative HTML
  • Use the data available in the scope
  • Create DOM on the fly
  • ng-repeat
  • ng-switch

(bidirectional) Data binding

  • connects models to views and vice versa
  • ngModel – new bindings

filters

  • {{ expression | filter }}
  • uppercase filter

partial views

  • history management
  • bind views to routes
  • ng-view

Components of Angular application

  • module
  • controllers
  • services
  • filters
  • directives

$routeProvider – configures routes in your module

Controllers

  • data provider for views
  • angularModule.controller

Scope

  • link between controllers and the views they’re bound to
  • controller adds data and functions so they’re visible in views
  • child scopes
  • directives can manage their own scope

Scope $watch

  • observe changes on the data of the scope in the controller

Scope $broadcast and $on

  • access to system of events and listeners on the scope
  • $broadcast to fire an event
  • $on to receive an event
  • Use $rootScope to send events to the whole application

Services

  • utility components of your application
  • controllers manage data for views
  • Use services to separate code to be reused in controllers
  • angularModule.factory
  • services can be injected into other Angular components – services, filters, controllers, directives

Directives

  • today’s HTML components
  • angularModule.directive
  • <div nameOfTheDirective></div>

REMEMBER Never ever manipulate the DOM from the controller

Here are the slides. They’re worth the time!

Be Sociable, Share!
This entry was posted in Frameworks, JavaScript.

Leave a Reply

%d bloggers like this: