Order of Operations

Migrating a large AngularJS application to Angular can be a big undertaking. We recommend the following order of operations during conversion.

• Webpack

• TypeScript

• Move as much code as possible into pure TypeScript modules

  • Write framework-agnostic unit tests for that code

  • Good candidates for this are stateless services

• Enable ngUpgrade

  • If used, replace the ng-app directive with angular.bootstrap.

  • Ensure App works

  • Install @angular/upgrade package

  • Create an Angular AppModule that inject the UpgradeModule and let it take over the bootstrapping.

• Identify components (directives) of the app most likely to benefit from Angular

  • These could be parts of the app where performance is a problem,

    parts where there will be more active development or

    parts that could really benefit from Angular libraries or components.

• Convert all service dependencies from AngularJS to Angular

  • Move existing .factory Angular services to .service

  • Leverage TypeScript classes

  • Use downgradeComponent(ServiceName) to expose Angular service to Angular.js

• Repeat this process until all components have been converted to Angular