Question

我从Ionic 2开始，我马上遇到了问题。我正在尝试复制已经工作的Angular 2应用程序。

当我尝试在另一个服务中使用服务时出现问题。

我有一个data.service.ts，它使用Http服务并提供一些额外的功能，这项服务将被我所有其他专业服务使用。

所以这是data.service.ts

import { Injectable, Inject } from '@angular/core';
import { Http } from '@angular/http';

import { Observable } from 'rxjs/Rx';

@Injectable()
export class DataService {

  constructor(private http:Http) {
  }

  getJson(url: string, update: number) {
    if (update !== -1) {
      return Observable.timer(0, update)
        .flatMap(() => this.http.get(url))
        .map(response => response.json());
    } else {
      return this.http.get(url)
        .map(response => response.json());
    }
  }

}

这是另一个服务，schedules.service.ts，它基本上使用data.service.ts来获取一些json文件并对恢复的数据做一些处理。

import { Injectable } from '@angular/core';

import { Observable } from "rxjs/Rx";

import { DataService } from './data.service';

@Injectable()
export class SchedulesService {

  // this will be changed with Constants.ts  
  private DATA_PATH = '/resources';
  private UPDATE_INTERVAL_DATA = 120000;

  //private schedules: Schedule[];
  private schedules: any[];
  private url = `//localhost${ this.PATH }/data.json`;

  constructor(
    private dataService: DataService) {
  }

  loadSchedules() {
    return this.dataService
      .getJson(this.url, this.UPDATE_INTERVAL_DATA)
      .map(data => {
        return data.schedules.list.map(item => {
          // do some stuff..
          return item;
        });
      });
  }

}

现在，在我的Angular 2应用程序中，这是有效的，因为我正在使用模块，而在模块中，我还要导入一个包含DataService的sharedModule。

@NgModule({
  imports: [ 
    routing,
    SharedModule.forRoot()
  ],
  declarations: [
    //...
  ],
  providers: [ SchedulesService ]
})
export class SchedulesModule { }

和sharedModule

@NgModule({
  imports: [ 
    CommonModule,
    HttpModule
  ],
  declarations: [ 
    //...
  ],
  exports: [
    //...
  ]
})
export class SharedModule {

  static forRoot(): ModuleWithProviders {
    return {
      ngModule: SharedModule,
      providers: [ 
        DataService
      ]
    };
  }
}

但是，在Ionic 2中我没有使用模块，当我尝试使用执行我之前的代码时，我得到了TypeError: Cannot read property 'get' of undefined

出错的行是这一行：

return this.http.get(url)
            .map(response => response.json());

我猜Http是未定义的，因为没有实例化，这可能是因为没有在ScheduleService中注入。那是对的吗？关于如何解决这个问题的任何想法？

EDIT。好的，我遗失了一些东西。使用SchedulesService的home.ts实际上在@Component的providers属性中有DataService，所以我认为这个工作正常，问题不应该与注入有关。有什么想法吗？

@Component({
  templateUrl: 'build/pages/home/home.html',
  providers: [ SchedulesService, DataService ]
})
export class HomePage {

  private schedules: any[];

  constructor(
    private schedulesService: SchedulesService,
    private commonCodesService: CommonCodesService,
    private dataService: DataService) {
  }

  getSchedules() {
    ...
    this.schedulesService
              .loadSchedules()
              .subscribe(() => this.updateSchedules());
   ...
  }
  ...

Answer 1

在使用Ionic 2应用程序时，我遇到了类似的问题（甚至是相同的问题）。每次我在另一个提供程序中使用它时，它都会创建一个新的共享服务实例。

似乎我只需要从app.components.ts中的提供程序中删除它：

@Component({
    templateUrl: 'app.html',
    providers: [], 
})

有关详细信息，您可以在离子论坛中查看我的论坛帖子：https://forum.ionicframework.com/t/shared-service-in-other-provider/72499/3

希望这有帮助！

在Ionic 2中将服务注入另一个服务

1 个答案: