I already figured this out and posted app at
GitHub: https://github.com/agolovan/AlexPhoneApp
On Tuesday, November 15, 2016 at 11:57:45 PM UTC-8, Alexander Golovan wrote:
>
> We have complex Angular 1.5 application that is using a lot of Angular 1.5
> components. I am thinking about starting developing of new components in
> Angular 2.0 and gradually replace 1.5 components with 2.0. I was able
> downgrade Angular 2.0 component and use it in Angular 1.5 app. However, I
> am having problems upgrading simple Angular 1 services to use them in the
> new Angular 2 component. I read many articles but most of them have
> references to old Angular 2 - beta or release candidates.
>
> Very simple Angular 1 services — file appresources.services.js. Those
> services are used in Angular 1.5 components:
>
> (function () {
>
> ‘use strict’;
>
> angular.module(‘phoneList’).service(‘appResourcesService’,
> appResourcesService);
>
> function appResourcesService() {
>
> // APPLICATION CONSTANTS:
>
> var BUILD_NUMBER = ‘Regional Beta 1.0’;
>
> function getBuildNumber() {
>
> return BUILD_NUMBER;
>
> }
>
> return {
>
> getBuildNumber: getBuildNumber
>
> };
>
> }
>
> })();
>
> This is what I have in main.ts. Component counter is already used in
> Angular 1.5 template.
>
> import { platformBrowserDynamic } from ‘@angular/platform-browser-dynamic’;
>
> import { UpgradeAdapter } from ‘@angular/upgrade’;
>
> import { AppModule } from ‘./angular2/app.module’;
>
> import {CounterComponent} from ‘./angular2/counter.component’;
>
> //Getting upgrade adapter
>
> let upgradeAdapter = new UpgradeAdapter(AppModule);
>
> platformBrowserDynamic().bootstrapModule(AppModule);
>
> //Making Angular 2.0 component to be used in Angular 1.5 app
>
> angular.module(‘phonecatApp’)
>
> .directive(
>
> ‘counter’,
>
> <any>upgradeAdapter.downgradeNg2Component(CounterComponent))
>
> upgradeAdapter.upgradeNg1Provider(‘appResourcesService’);
>
> upgradeAdapter.bootstrap(document.body, [‘phonecatApp’]);
>
> This is my new component that I am planning to use those services:
>
> import {Component, Input, OnInit} from ‘@angular/core’;
>
> import {Injectable, Inject} from ‘@angular/core’;
>
> import {UpgradeAdapter} from ‘@angular/upgrade’;
>
> @Component({
>
> selector: ‘pagefooterng2’,
>
> template: `
>
> <div>
>
> {{message}}
>
> </div>
>
> `
>
> })
>
> export class PagefooterN2Component implements OnInit {
>
> private message: string;
>
> constructor( @Inject(‘appResourcesService’) appResourcesService) {
>
> }
>
> ngOnInit() {
>
> this.message = “Some message”;
>
> }
>
> }
>
> This is very simple, however, I can't use services at component level,
> they are not available as I see om Chrome debugger.
>
> I feel that import statements are missed here, however, how can I import
> from Angular 1.5 services?
>
> Any help would really appreciated!
>
--
You received this message because you are subscribed to the Google Groups
"Angular" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at https://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.
