8

I have my angular app with version 1 so can i upgrade it with angular version 2

We started to design a new project that designated to be built with Angular as each of our previous, the importance of this project is very high and it's going to live and maintained for at least years.

Angular 2.0 has came in beta mode and it seems like everything is about to change, $scope is out, directives are out and the whole DI concept is about to change.

  1. Is there a migration path/strategy to be considered in the next few months?
  2. If we built the project using 1.x, what action do we need to take during development to ensure a clean migration? Are those 2 versions can be considered as 2 different framework?

Please help me to sort out.

SnareChops
  • 13,175
  • 9
  • 69
  • 91
user2515556
  • 101
  • 1
  • 2

3 Answers3

5

I think that migrating from Angular 1 to 2 is not nearly as bad as most people think it is.

Basically, you need to break it down and migrate the concepts first...

  • Bootstrapping
  • Controllers
  • Directives
  • Components
  • Modules
  • Routing
  • Services
  • Forms
  • Filters

Almost all of those can be mapped back to 1.x concepts - even if there is not a 1:1 relationship. Once you understand how each of these things are done, it's much easier to decide how to slowly migrate your existing code to the new concepts.

It's hard to cover each and all of those things in a single SO answer, so maybe check out ngmigrate.telerik.com which goes into a lot more detail.

Burke Holland
  • 2,325
  • 1
  • 22
  • 33
3

Enabling mixing of Angular 1 and Angular 2 in the same application. You can mix Angular 1 and Angular 2 components in the same view. Angular 1 and Angular 2 can inject services across frameworks. Data binding works across frameworks.

Application upgrade process:

  1. Include the Angular 2 and ng-upgrade libraries with your existing application
  2. Pick a component which you would like to migrate
    • Edit an Angular 1 directive's template to conform to Angular 2 syntax
    • Convert the directive's controller/linking function into Angular 2 syntax/semantics
  3. Use ng-upgrade to export the directive (now a Component) as an Angular 1 component (this is needed if you wish to call the new Angular 2 component from an Angular 1 template)
  4. Pick a service which you would would like to migrate
    • Most services should require minimal to no change.
    • Configure the service in Angular 2.
    • (optionally) re-export the service into Angular 1 using ng-upgrade if it's still used by other parts of your Angular 1 code
  5. Repeat doing step #2 and #3 in an order convenient for your application development
  6. Once no more services/components need to be converted drop the top level Angular 1 bootstrap and replace with Angular 2 bootstrap.

ref: http://angularjs.blogspot.com/2015/08/angular-1-and-angular-2-coexistence.html

Abilash
  • 221
  • 1
  • 2
  • 9
0

There is a online website which converts angular 1.x HTML code snippets to Angular 4.x. it goes not support ts yet but if you have old application with lots of HTML pages, this might come handy.

https://www.linkedin.com/pulse/online-angular-1x-4x-converter-balram-chavan

http://angular.cloud

Balran Chavan
  • 155
  • 2
  • 12