5 Simple Steps to Migrate Angular1 Apps to the Latest Angular
1. Change the bootstrap logic to use UpgradeModule
Firstly, bootstrap Angular 2 and once done, bootstrap Angular 1 using the NgUpgrade.bootstrap method. The Angular 1 router uses the ng-view generated by RootCmp in order to instantiate its template. Now, the app combines aspects of Angular 1 and Angular 2 even though the Angular 1 app is just wrapped around by Angular 2 code and the app logic is still written in Angular 1.
2. Update all the modules to export a ng module
In this step, you will eventually move all the components, services and routes from MenuModule to MenuNgModule. This will ensure the migration of all the modules to Angular 2 by creating new ng modules.
Recommended read — Top 4 .NET Framework Features for App Modernization
3. Start migrating individual services and components
This is one of the most time-taking steps in the whole migration process which includes porting individual components to Angular 2 one after another. However, migrating services will be pretty straightforward. If the modules are tightly coupled then consider migrating them all at once, otherwise migrate one and then move to step 4.
4. Divide the routes between routers of Angular 1 and Angular 2
In small applications, you can migrate all the components in one go and then rewrite routes for them. However, when the application is large migrate one module and then wire it up in ng2_app.ts (consult experts at an Angular Development Agency to know about this step in detail). At the end of this step, you would find that the whole module has been successfully migrated to Angular 2.
5. Once all the modules are migrated, remove Angular 1
In this final step, once again, ensure that all the modules have been migrated and once done update the ng2_app.ts and main.ts files to remove all the usages of UpgradeModule.
It would be better to consult an Angular specialist to carry out the process more professionally and successfully.
Originally published at www.techsling.com on February 16, 2017.