如何使用 EM6 ngupgrade 将 angularJS 版本 1.X 控制器转换为 angular 2.X

Question

angular.module('app', []).controller('MessagesCtrl', function() {

$scope.self.list = [
{text: 'Hello, World!'},
{text: 'This is a message'},
{text: 'And this is another message'}
];

self.clear = function() {
$scope.self.list = [];
};
});

这是一个用 Angular 编写的控制器。如何使用 EM6 将其转换为角度 2。

Answer 1

据我所知，关于升级的教程并不多，但确实很少。

https://angular.io/docs/ts/latest/guide/upgrade.html

http://blog.thoughtram.io/angular/2015/10/24/upgrading-apps-to-angular-2-using-ngupgrade.html

让我告诉你基本的 angular2 应用程序。

在 Angular 1.x 中，我们的主模块是这样初始化的

angular.module('app', [])

但在 angular2 中，我们的主要组件是从这样的引导文件开始的。

import {bootstrap} from 'angular2/platform/browser';
import {App} from './app';

bootstrap(App,['here global level dependenices....']); 

这里的 app 是我们的主要组件，它被导入到这个引导文件中。所以 bootstraped 是我们应用程序的入口点。和 如果我们想做一些编码工作，比如我们在 angular1.x 控制器中工作，我们在类文件（打字稿类）中做同样的工作 我在这里发布一个这样的基本示例。

import {Component, View} from 'angular2/core';

@Component({
    selector: 'app',
    templateUrl: "src/app.html",
    styleUrls: ['src/app.css'],
    directives: [ directives list here....],
})

export class App 
{ 
    // stuff you want to do here 
}

首先我们必须从 systemjs 包中导入 angular2 包，就像我们从 angular2/core.xml 导入组件和视图一样。 angular2 有很多进口产品。你可以check out here和here