Question

我构建了一个服务，从API可观察的API中获取特定的ID。该服务正在运行，如果我是来自服务类的console.log（数据），但我无法获取组件中的数据。

服务：

getSpecificStory(storyId) {
    return this.getToken()
      .map(idToken => {
        let headers = new Headers();
        headers.set('user_token', idToken)
        return this.http
          .get(`${this.apiUrl}/stories/${storyId}`, { headers: headers })
          .subscribe((res: Response) => {
            const data = res.json();
            console.log(data)
            return data;
          });
      })
      .catch(this.handleError);
  }

组件：

export class StoryModalComponent implements OnInit {
  story: any;
  storyId: any;
  hitsArray: Array<Object>;

  constructor(private storiesService: StoriesService, private route: ActivatedRoute) {
  }

  ngOnInit() {
    this.route.params
      .subscribe(
      params => {
        this.storyId = params['storyId']
      })
    console.log(this.storyId)
    this.getStoryObject();
  }


  getStoryObject() {
    console.log(this.storyId)
    this.storiesService.getSpecificStory(this.storyId)
      .subscribe(
      (data) => {
        this.story = data;
        console.log(this.story)
      })
  }
}

Answer 1

您必须返回observable才能使用comonent中的用户订阅方法。

getSpecificStory(storyId) {
return this.getToken()
  .map(idToken => {
    let headers = new Headers();
    headers.set('user_token', idToken)
    return this.http
      .get(`${this.apiUrl}/stories/${storyId}`, { headers: headers })
      .map((res: Response) => res.json());
      .catch(this.handleError);
  })
  .catch(this.handleError);}

Answer 2

您正在寻找flatMap运算符而不是map。

getSpecificStory(storyId) {
    return this.getToken()
        .flatMap(idToken => {
            let headers = new Headers();
            headers.set('user_token', idToken)
            return this.http
                .get(`${this.apiUrl}/stories/${storyId}`, { headers: headers })
        });
    })
}

.flatMap希望你返回一个observable（在你的例子中是this.http.get（...））。现在getSpecificStory方法返回一个observable。所以你在组件中订阅了

this.storiesService.getSpecificStory(this.storyId)
    .subscribe(
        (data) => {
            this.story = data;
            console.log(this.story)
         })

当您链接依赖的observable（firebase getToken（）方法和this.http.get（））时，这是常用的方法

从API服务角度4获取数据

2 个答案: