Question

我有Angular 4应用程序。我在服务的构造函数中调用getCity（）方法来初始化cityId属性。我在另一种方法中使用cityId？例如，getData（）。当我试图在组件中调用getData（）时，我收到错误，即cityId未定义。我认为这是因为当getData（）开始执行时，getCity（）没有完成它的执行。这两个方法都使用Observables，并返回Observable。我用getCity（）解决了这个问题.concatMap（（id）=＆gt; getData（...））。

你能告诉我，请问是对的吗？也许有更正确的方法？

@Injectable()
export class CustomService {

  cityId: number;

  constructor(private http: HttpClient,
              private citiesService: CitiesService) {
    this.getCityId()
  }

  getCityId() {
    return this.citiesService.getCity().subscribe(
      (city) => {
        this.cityId = city['id']
      });
  }

  getData() {
    /* use this.cityId here */
  }

Answer 1

您可以在服务完成getData()后调用getCity()方法：

getCityId() {
  return this.citiesService.getCity().subscribe({
    next: (city) => {
      this.cityId = city['id'];
    }, 
    complete: () => {
      this.getData();
    }
  });
}

Answer 2

取决于getData是否正在拨打服务电话，您能否显示getData的内容？如果getData正在进行另一个服务调用，则可以使用switchMap。如果没有，常规map应该适合您。

    @Injectable()
    export class CustomService {

    constructor(private http: HttpClient,
                private citiesService: CitiesService) {
    }

    getCityId() {
        return this.citiesService.getCity()
    }

    getDataAsynchronous() {
        return this.getCityId()
            .map(city => city.id)
            .switchMap(id => this.service.serviceCall())
    }

    getDataSynchronous() {
        return this.getCityId()
            .map(city => city.id)
            .map(id => processID(id))
    }

    processID(id: string) {
        // do something with id
        return id;
    }

Answer 3

getCity.subscribe(data => console.log(data))

Angular 4，方法在构造函数初始化值之前执行

3 个答案: