0
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 = [];
};
});

this is a controller written in angular. how can I convert this into angular 2 using EM6.

SnareChops
  • 13,175
  • 9
  • 69
  • 91
Buddhika Kulathilaka
  • 497
  • 2
  • 5
  • 25
  • can any one share tutorial for Upgrade angular 1.x into angular 2.x using EM6 or EM5 – Buddhika Kulathilaka Jan 20 '16 at 05:06
  • there is no "controller" in Angular 2. You either upgrade your directive or component via ngUpgrade or rewrite them in Angular 2. Let me know what you are looking for, I should be able to give you some examples. – sdfacre Jan 20 '16 at 06:01
  • In typescript "import {UpgradeAdapter} from 'angular2/upgrade';" used for import UpgradeAdapter.I want to kow how this done using EM6 or EM 5 – Buddhika Kulathilaka Jan 20 '16 at 06:11
  • like this: - var adapter = new ng.upgrade.UpgradeAdapter(); and then adapter.bootstrap(document.body, ['yourApp']); – sdfacre Jan 20 '16 at 06:13
  • can u share some examples? thank you :) – Buddhika Kulathilaka Jan 20 '16 at 06:15
  • I certainly can. But you need to elaborate your question a little bit, for example, the code of you current ng1.x directive that you want to upgrade and how you would like to use it in angular 2. – sdfacre Jan 20 '16 at 06:25
  • https://plnkr.co/edit/ATRu9J3g2G2BCPjSJYD1?p=info can u help me to upgrade this code – Buddhika Kulathilaka Jan 20 '16 at 06:58
  • has networking issue at the moment, will try to work on the plunker later. as I said, you can't upgrade controller alone as there is no such thing in Angular 2. you need to create a directive that uses the controller and then upgrade that directive. – sdfacre Jan 20 '16 at 07:24
  • 1
    see https://plnkr.co/edit/03ljJfPvw3ESuL9QCQYH?p=preview, the fileReader is wrapped as a directive and used by a angular 2 component. – sdfacre Jan 20 '16 at 09:48
  • thank you!..but the variables are define as $scope.. is it OK.. – Buddhika Kulathilaka Jan 20 '16 at 11:15

1 Answers1

1

well upto my knowledge there are not alot of tutorials for the upgradation but yes thetre are few one.

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

well let me tell you about basic angular2 app.

in angular 1.x our main module is initilize like this

angular.module('app', [])

but in the angular2 our main component started from the bootstraped file like this.

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

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

here app is our main component whihc is imported in this bootstrap file. so bootstraped is file our entry point of the app. and if we want to do some coding stuff like we work in the angular1.x controller here we do the same work in the class file (typescript class) here i am posting one basic example like this.

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 
}

firstly we have to import angular2 bundles from the systemjs bundles like we imported Component and view in this example from the angular2/core. there are alot of imports available for the angular2. you can check out here and here

Community
  • 1
  • 1
Pardeep Jain
  • 84,110
  • 37
  • 165
  • 215