2017-08-30 1 views
0

Ich benutze Angular2/4, um eine Web-App zu erstellen.QueryParameter auf POST

Ich muss das Objekt an den Rest API mit Abfrage-Parameter senden. Mein Endpunkt wird nur ein Objekt durch die URL wie folgt akzeptieren:

localhost:8080/api/node?type=bills&quantity=2 

meinen Dienst derzeit sein wie folgt aus:

addInstance(instance: Instance) { 
    const params = { 
    type: instance.type, 
    quantity: instance.quantity 
    }; 
    return this.http.post(this.baseUrl, params, {headers: this.headers}) 
    .map(res => { 
    return res.json(); 
    }); 
} 

Aber es funktioniert nicht und in der Konsolenprotokoll sagt, es gibt kein Objekt vorbei in die URL Wie kann ich einen korrekten Aufruf an die API bereitstellen?

+0

Was bedeutet "es funktioniert nicht" genau? Sind Sie sicher, dass der Server eine POST-Anfrage erwartet? Erhalten Sie eine Fehlermeldung? Wenn ja, füge es bitte zu deiner Frage hinzu. –

Antwort

3

Sie senden gerade Körperparameter, keine URL-Parameter und Ihr Endpunkt erwartet URL-Parameter. Sie können jedoch url params in Winkel mit URLSearchParams

Try konstruieren:

addInstance(instance: Instance) { 
    const params = new URLSearchParams(); 
    params.set('type', instance.type); 
    params.set('quantity', instance.quantity); 

    return this.http.post(this.baseUrl, body?, {params: params} ) 
     .map(res => { 
     return res.json(); 
     }); 
} 

Sie können auch bauen einfach die URL direkt String-Verkettung verwenden.

Obwohl es sich um eine Post-Anfrage handelt, sollten Sie mit Ihrem API-Endpunkt herausfinden, was der Hauptteil der Anfrage sein soll, da eine Post-Anfrage normalerweise einen enthält. Andernfalls sollten Sie den API-Endpunkt ändern, um stattdessen eine Abrufanforderung zu erstellen. Oder lassen Sie den API-Endpunkt Körperparameter anstelle von URL-Parametern erwarten.

+0

gibt es keine Möglichkeit, dass wenn die http.post die params ausführen könnte dies in der URL gesetzt werden könnte? –

+0

Bitte klären. Dies wird die Parameter in der URL festlegen ... – yoonjesung