Angular 2 XHR Post Not Executing

时间:2017-05-27 22:27:35

标签: angular typescript angular2-observables

我不确定我做错了什么,但是createPost方法中的一个简单的http.post似乎并没有执行。

我在.NET后端设置了断点,并且它们不会在调试器中被点击。奇怪的是,如果我使用带有URL的postman登录到控制台,它工作得很好,所以我把它缩小到了TypeScript方法。其他方法,如让所有帖子也能正常工作。

如果我向subscribe()方法添加createPost,则表示Subscription无效,因为未设置_isScalar

任何想法我可能做错了什么?

//post-form.component.ts.   First link in the chain.   Calls this.postService.save()      
save() {
          if (this.model.title && this.model.body) {
              this.saving = true;
              this.postsService.save(this.model)
                  .then((res) => {
                      console.log(res);
                  })
                  .then(() => this.saving = false);

      }
  }

//posts.service.ts.  //2nd link in the chain.   calls the createPost method.
save(post: Post) {
    return new Promise((resolve, reject) => {
        if (!post.postId) {
            console.log('Waypoint 34');
            post.state = post.state ? post.state : 'unsaved';
            this.createPost(post)
                .map(

                res => resolve(res)
                );
        } else {
            let headers = new Headers({ 'Content-Type': 'application/json' });
            let options = new RequestOptions({ headers: headers });
            this.http.put(environment.api + '/posts/save', post, options)
        }
    })
}


createPost(newPost: Post): Observable<ResponseResult>  { // problem child.
    let headers = new Headers({ 'Content-Type': 'application/json' });
    let options = new RequestOptions({ headers: headers });
    console.log(environment.api + '/posts'); //gets here.
    return this.http.post(environment.api + '/posts', newPost, options)
        .map(this.helpers.extractData)  //doesn't get here.
        .catch(this.helpers.handleError);
}

//helpers.service.ts

  extractData(res: Response) {
      let body = res.json();
      return body.data || body ||  {};
  }

编辑调出哪个方法没有执行(createPost),进一步注释的代码和添加的helpers.extractData(来自John Papa)

1 个答案:

答案 0 :(得分:0)

这里的问题是,虽然createPost返回一个Observable,只要它没有订阅它就不会开始执行。在调用createPost之后调用map时,您需要将其切换为订阅调用,因为您已完成Observable。

this.createPost(post)
            .subscribe (
                res => resolve(res)
            );

我建议进一步阅读冷热可观测量。