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

How to convert angularJS version 1.X controller into angular 2.X using EM6 ngupgrade

本文关键字:转换 控制器 EM6 何使用 ngupgrade 版本 angularJS      更新时间:2023-09-26
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 编写的控制器。 如何使用 EM2 将其转换为角度 6。

我所知,升级教程并不多,但是是的

,很少。

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....']); 

这里应用程序是我们的主要组件,它导入到这个引导文件中。 所以引导是文件我们的应用程序入口点。如果我们想做一些编码工作,就像我们在 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 导入组件和视图一样。Angular2有很多导入可用。你可以在这里和这里查看