कोणीय 2 http.post () अनुरोध नहीं भेज रहा है


141

जब मैं पोस्ट अनुरोध करता हूं तो कोणीय 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=>{});

क्या यह इरादा है और अगर यह कोई मुझे समझा सकता है तो क्यों? या यह एक बग है?

जवाबों:


227

चूंकि कक्षा की postविधि Httpएक अवलोकन योग्य है, इसलिए आपको इसकी आरंभीकरण प्रक्रिया को निष्पादित करने के लिए सदस्यता लेने की आवश्यकता है। वेधशालाएं आलसी हैं।

अधिक जानकारी के लिए आपको इस वीडियो को देखना चाहिए:


15
@ टिहरी वीडियो नहीं देख सकता, क्योंकि यह केवल सदस्यों के लिए है
तातारिन

49

यदि आप कॉल को निष्पादित करना चाहते हैं, तो आपको वापस देखे जाने योग्य सदस्यता लेनी चाहिए।

Http प्रलेखन भी देखें ।

हमेशा सदस्यता लें!

एक HttpClientविधि अपना HTTP अनुरोध तब तक शुरू नहीं करती है जब तक कि आप उस विधि द्वारा दिए गए अवलोकन योग्य पर सदस्यता () को कॉल नहीं करते हैं। यह सभी HttpClient विधियों के लिए सही है ।

AsyncPipe आप के लिए सदस्याएं (और सदस्यता समाप्त करने पर) स्वचालित रूप से।

HttpClientतरीकों से लौटे सभी वेधशालाएं डिजाइन द्वारा ठंडी हैं । HTTP अनुरोध के निष्पादन को स्थगित कर दिया गया है , जिससे आप अतिरिक्त संचालन जैसे कि tapऔर catchErrorइससे पहले कि वास्तव में कुछ भी हो सकता है का पालन कर सकते हैं।

कॉलिंग subscribe(...)नमूदार की चलाता निष्पादन और कारण बनता HttpClientलिखें और सर्वर के लिए HTTP अनुरोध भेजने के लिए।

आप इन वेधशालाओं को वास्तविक HTTP अनुरोधों के ब्लूप्रिंट के रूप में सोच सकते हैं।

वास्तव में, प्रत्येक subscribe()अवलोकन के लिए एक अलग, स्वतंत्र निष्पादन शुरू करता है। दो 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.

41

जाओ विधि सदस्यता विधि का उपयोग करने की आवश्यकता नहीं है, लेकिन पोस्ट विधि सदस्यता की आवश्यकता है। नमूना कोड प्राप्त करें और पोस्ट करें।

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();
    }
}
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.