Angular 2 http.post()不发送请求

时间:2016-03-24 19:41:53

标签: angular angular2-http

当我发帖请求时,角度2 http不发送此请求

this.http.post(this.adminUsersControllerRoute, JSON.stringify(user), this.getRequestOptions())

http帖子没有发送到服务器,但如果我发出这样的请求

this.http.post(this.adminUsersControllerRoute, JSON.stringify(user), this.getRequestOptions()).subscribe(r=>{});

这是有意的,如果可以有人解释我为什么?或者这是一个错误?

3 个答案:

答案 0 :(得分:167)

由于post类的Http方法返回一个observable,您需要订阅它以执行其初始化处理。可观察者很懒惰。

您应该查看此视频了解更多详情:

答案 1 :(得分:32)

Get方法不需要使用subscribe方法,但post方法需要订阅。获取和发布示例代码如下。

import { Component, OnInit } from '@angular/core'
import { Http, RequestOptions, Headers } from '@angular/http'
import 'rxjs/add/operator/map'
import 'rxjs/add/operator/catch'
import { Post } from './model/post'
import { Observable } from "rxjs/Observable";

@Component({
    templateUrl: './test.html',
    selector: 'test'
})
export class NgFor implements OnInit {

    posts: Observable<Post[]>
    model: Post = new Post()

    /**
     *
     */
    constructor(private http: Http) {

    }

    ngOnInit(){
        this.list()
    }

    private list(){
        this.posts = this.http.get("http://localhost:3000/posts").map((val, i) => <Post[]>val.json())
    }

    public addNewRecord(){
        let bodyString = JSON.stringify(this.model); // Stringify payload
        let headers      = new Headers({ 'Content-Type': 'application/json' }); // ... Set content type to JSON
        let options       = new RequestOptions({ headers: headers }); // Create a request option

        this.http.post("http://localhost:3000/posts", this.model, options) // ...using post request
                         .map(res => res.json()) // ...and calling .json() on the response to return data
                         .catch((error:any) => Observable.throw(error.json().error || 'Server error')) //...errors if
                         .subscribe();
    }
}

答案 2 :(得分:31)

如果要执行调用,则必须订阅返回的observable。

另请参阅Http documentation

  

始终订阅!

     

在您对该方法返回的observable上调用subscribe()之前,HttpClient方法不会开始其HTTP请求。对于所有HttpClient方法都是如此。

     

AsyncPipe自动订阅(和取消订阅)。

     

HttpClient方法返回的所有可观测量都是设计。 HTTP请求的执行是 deferred ,允许您在实际发生任何事情之前使用tapcatchError等其他操作扩展observable。

     

调用subscribe(...)会触发observable的执行,并导致HttpClient撰写并将HTTP请求发送到服务器。

     

您可以将这些可观察对象视为实际HTTP请求的蓝图

     

实际上,每个subscribe()都会启动一个独立的独立执行的observable。订阅两次会产生两个HTTP请求。

content_copy
const req = http.get<Heroes>('/api/heroes');
// 0 requests made - .subscribe() not called.
req.subscribe();
// 1 request made.
req.subscribe();
// 2 requests made.