在Angular / AngularJS混合应用程序中使用服务(ng-upgrade)

时间:2018-04-30 19:51:44

标签: angularjs angular ng-upgrade

目前为plunker构建应用程序的精简版本,所以我可以向您展示我的问题,但如果有人在同一时间有任何提示,我会尝试描述我的问题第一

我使用ngUpgrade开始将AngularJS中的大型应用程序带到Angular。我有一个使用Angular运行的核心应用程序。简而言之,它设置得有点像这样:

@Component({
  selector: '[my-app]',
  template: `
    <app-main></app-main>
  `
})
export class AppComponent {};

@NgModule({
  imports: [
    BrowserModule,
    UpgradeModule,
  ],
  bootstrap: [AppComponent],
  declarations: [
    AppComponent
  ],
  schemas: [
    CUSTOM_ELEMENTS_SCHEMA
  ]
})
export class AppModule {
  constructor(public upgrade: UpgradeModule) { }
}

export const Ng1AppModule = angular.module(
    'mainApp',
    [
        'feature.one'
    ]
);

platformBrowserDynamic().bootstrapModule(AppModule).then(ref => {
  ref.instance.upgrade.bootstrap(document.body, [Ng1AppModule.name], {});
});

它成功引导自身并运行一个根组件,它基本上加载了旧的AngularJS应用程序。到目前为止没有重大问题。

AngularJS应用程序依赖于许多自定义功能模块,我现在需要将其转换为Angular。

在我要转换服务的其中一个功能模块上。它现在是一个Angular @Injectable内置的打字稿,它被分配给AngularJS模块,如下所示:

export const Ng1FeatureModule = angular
    .module('feature.one', ['ngCookies'])
    .service('UpgradedService', downgradeInjectable(UpgradedService) as any);

此服务需要来自我尚未转换的服务的依赖项。  例如:

@Injectable()
export class UpgradedService{
    public var1: string;

    constructor(private nonconvertedNG1Service: NonconvertedNG1Service) {
         this.var1 = nonconvertedNG1Service.get();
    }

    public getVar1() {
        return this.var1;
    }
}

我如何进行设置,以便我的示例应用使用&#39;升级服务&#39;和UpgradedService能够使用NonconvertedNG1Service?

0 个答案:

没有答案