Getting Ready for AngularJS 1.2

  • Sep 18, 2013 at 3:24 PM
  • Shawn Wildermuth
  • 5 Comments

AngularJS is going through their release cycle now and that means that AngularJS 1.2 is going to be released soon with some specific changes that you'll need to address. I'll be updating my Pluralsight Course with the 1.2 changes as soon as the new version ships.

Routing

The biggest change for most people is the routing support is now packaged separately. To use routing you'll need to do two things:

Include the new angular-route.js:

<!-- JS -->
<script src="~/Scripts/jquery-2.0.2.min.js"></script>
<script src="~/Scripts/angular.min.js"></script>
<script src="~/Scripts/angular-route.min.js"></script>

You'll also need to specify that ngRoute is a dependency when you create your modules:

var module = angular.module("homeIndex", [
  'ngRoute'
]);

$q

The $q object has also changed. If you have used the always() call, you will need to change that to finally() to better align with other Q promise libraries. For example:

// Prior to 1.2
$http.get("foo").always(function () {});

// Now
$http.get("foo").finally(function () {});

// IE8 Compatible Version
$http.get("foo")['finally'](function () {});

Because the finally function isn't allowed in IE8, you'll need to use the final version shown here if you need to support IE8.

ngHtmlBind and ngHtmlBindUnsafe

In addition, the ngHtmlBindUnsafe has been replaced with ngHtmlBind. The ngHtmlBind now does not sanitize your data and just emits HTML. If you need to sanitize your code before emitting it, you should use the ngSanitize (basically just the old ngHtmlBind renamed to this new directive). This means that if you are expecting your HTML to be sanitized, you need to change your directives as this will cause old ngHtmlBind directives to now emit the HTML without sanitation.

ngMobile

The old ngMobile directive has been renamed to ngTouch since all the functionality depended on touch support.

Other Breaking Changes

I've only touched on the changes that directly effected me. You should read the release notes and breaking changes in the changelog. Remember to read the changes for previous 1.2.x versions too to see all the changes:

https://github.com/angular/angular.js/blob/master/CHANGELOG.md

 

Comments

Gravatar

Dave Hogan Friday, September 20, 2013

Thanks for sharing this Shawn. I really don't like:
$http.get("foo")['finally'](function () {});

It's not that IE8 causes the problem it's ES3 standards saying you cannot use reserved keywords as property names. Finally being a reserved keyword :(

Gravatar

Shawn Wildermuth Friday, September 20, 2013

Dave,

Agreed. I should have said ES3

Gravatar

Brett Baggott Saturday, September 21, 2013

Shawn, any thoughts on why they packaged routing separately? I've only been studying AngularJS for a short while now (great course BTW), and haven't been following the changes but routing has been a particular focus of mine. I have some thoughts but I'd like to hear yours.

Gravatar

Shawn Wildermuth Saturday, September 21, 2013

Brett,

My assumption is core library size. They've been dinged by other competing projects about size of the core. Routing is a bit heavy and when you don't need it, you're still compiling all that code. I assume they are moving towards this modular approach across several of the important pieces that might be larger.


Leave a Comment

*
*
*