Upgrade to Angular 1.6

- [Instructor] Before using the latest Angular features and capabilities, you have to upgrade projects to run with the latest version of Angular. Upgrading the actual dependencies a project uses can be a delicate operation. There are three steps to upgrade dependencies. The first, I need the latest version of Angular and its sub-dependencies. Second, I'll determine the necessary updates to the code to handle the breaking changes in Angular. Finally, I'll need to update third-party libraries to match the version of Angular.

I'll begin by checking the version of Angular an app is using. Depending on how a project's dependency management is done, this might be written inside NPM's package.json file, or Bower's bower.json file. It is also usually possible to open an app in the browser and then I can use the developer tools console to find the value of angular.version.full. Then, I'll go into Angular's Migration Guide and find the same version. From there I can scroll up through each version and look at the breaking changes listed.

Some of it is bound to sound like gibberish. There are quite a few less unknown corners of Angular that might have changed. Those sections are probably safe to scroll by. Once you spot something that's related to Angular features you use, go into your code and fix it. Once I've gone over all the issues, it's time to update Angular itself. Again, based on the way dependencies are managed, this likely means changing the version in bower.json, package.json, or something similar and then triggering an update of the dependencies, for example using NMP install.

If you use any additional models from Angular itself such as ng-animate or ng-resource, you should make sure to update those as well to the same version. A big change that affects all older code bases is in the way Angular initializes controls bindings. For now, handling it simply requires adding a config block to the app that disables this change. In some projects, once the big changes are made, the app will load normally with everything working smoothly.

In those projects, upgrading third-party libraries is a nice to have. But, since third-party libraries depend on Angular as well, older versions might be broken when used with the latest version. Here, the process is similar but not as straight-forward. Unfortunately, the number of libraries that have a well-maintained change log or migration guide isn't as high as it should be. Therefore, finding the right versions to use might feel a bit like a round of whack-a-mole.

I recommend looking at the issues and release logs to try and find the versions that will work for you. At this point it is worth noting that it's not always possible to update a project's Angular version in one go. Sometimes, in larger complex projects that warrant extra caution, it will make more sense to upgrade in baby steps. For example, if a project is using Angular one dot two, I'd suggest following the migration guide by first upgrading to one dot three, then to one dot four, et cetera.

Having these safe checkpoints can expedite the upgrade process of sizable projects.