Angular 2.0 Dependency Injection - Applied To Backbone TodoMVC

Posted on by Tero Parviainen

Update 2014-05-06: Since this was written, a few changes have been made in the Angular DI library. The relevant changes are highlighted below.

Bits and pieces of AngularJS 2.0 are starting to surface: The design docs are out there for everyone to read, and there are initial implementations available for change detection, logging and profiling, templating, zones, type assertions, and the HTTP client. These are exciting times for an Angular developer!

I like how these components are being developed as independent modules in independent repositories. This makes it possible for app developers to mix and match Angular libraries with other frameworks and tools, whereas Angular 1.x has been much more of an all-or-nothing proposition.

One of the new components I find most interesting is the dependency injection library at angular/di.js. It is the library that will power dependency injection in Angular 2.0, but it is also a standalone DI framework that can be used in non-Angular contexts, enabling some of that mixing and matching.

Read more →


The Three Watch Depths of AngularJS

Posted on by Tero Parviainen

Update: A revised version of this is now in the official Angular docs.

There are three different mechanisms for watching a value on an Angular scope: Reference watches, collection watches, and equality watches. The difference between the three is in the depth in which they watch their values.

Choosing the most appropriate watch mechanism is important, not only because the three mechanisms behave differently, but also because they have very different performance characteristics.

This short article describes the differences between the three watch depths.

Read more →


Writing A Book About Making Your Own AngularJS

Posted on by Tero Parviainen

Update: "Build Your Own AngularJS" is now available as an early-access eBook.

I was very happy to see the enthusiastic response to the "Make Your Own AngularJS" article I published earlier this month. It generated a lot of traffic, a lot of discussions, and even two translated versions: One in Chinese and one in Russian.

Several people suggested turning the series into an eBook, and I've decided to go for it. Here's how.

Read more →


Make Your Own AngularJS, Part 1: Scopes And Digest

Posted on by Tero Parviainen

Update: "Build Your Own AngularJS" is now available as an early-access eBook.

Angular is a mature and powerful JavaScript framework. It is also a large framework with many new concepts one needs to grasp before becoming truly effective. As web developers flock to Angular, many of them face the same hurdles. What exactly does the digest do? What are all the different approaches to defining a directive? What's the difference between a service and a provider?

While the Angular documentation is getting very good, and there's an increasing number of third-party resources, there's really no better way to really learn a technology than to take it apart and see what makes it tick.

In this article series, I'm going to build an implementation of AngularJS from the ground up. As I take you through it step by step, you'll gain a deep understanding of exactly how Angular works.

In this first installment of the series we'll see how Angular scopes work and what things like $eval, $digest, and $apply actually do. The dirty-checking logic of Angular may seem somewhat magical, but it really isn't, as you'll see.

Read more →