Angular 2のBetaが出ましたね。そろそろ使い始めてもいいのかな。
Angular 2はAngular JSに比べ、書きやすく、また動作が速くなっているようです。
みなさんはすでにAngular JSで何かしらのアプリケーションを動かしてますか？すべてをAngular 2で書き直していきますか？ngUpgradeというものを使えば、Angular JSでの資産をAngular 2でも利用できるかも。
AnuglarチームはAngular 1からAngular 2へのマイグレーションを楽できるよう考えてくれているみたいです。
ということで、今回はngUpgradeについて書きたいと思います。

前提

Angular 2のバージョンは2.0.0-beta.0
Angular JSのバージョンは1.4.8

参考

Strategy

既存のAngular JS 1アプリを移行する手段としては、

全部えいやっと書き換える
少しずつ書き換えていく

少しずつ書き換えていくやり方もいくつかあるようで、Typescriptに置き換え、ng-forwardや、Angular JS 1.5でのComponentを使ってAngular JS 1にて、Angular 2っぽく記述していき、Adapterを利用しAngular 2で動くようにして、最終的にAdapterがなくても動くように書き換えていく。

どんな感じか

index.ts

import "angular";
import "reflect-metadata";
import {Component} from "angular2/core";
import {UpgradeAdapter} from "angular2/upgrade";

var adapter: UpgradeAdapter = new UpgradeAdapter();

//本来ならちゃんとd.tsを利用しなければいけないところでしょうか
declare var angular:any;
var app = angular.module("myApp", []);

@Component({
  selector: "ng2",
  template: `
    <div>
      Angular 2 component
    </div>
  `
})
class Ng2 {
}

app.directive("ng2",
  adapter.downgradeNg2Component(Ng2));

adapter.bootstrap(document.body, ['myApp']);

UpgradeAdapterを利用します。ComponentをDirectiveに接続していきます。
adapter.bootstrap()を利用して、Angular JSでのng-app="myApp"の代わりとします。

index.html

<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
</head>
<body>
    <ng2></ng2>
    <script src="./bundle.js"></script>
</body>
</html>

<body ng-app="myApp">とかのng-app属性は取り除きます。

最後に

Service等々も少しづつ置き換えていく感じなのかな。
具体的な完全移行の流れはUpgrading from 1.x 公式チュートリアルを見れば書いてあります。結構なボリュームです。

Angular 2: upgrading from 1.x

前提

参考

Strategy

どんな感じか

最後に