Angular2 HTTP Post ASP.NET MVC-Web-API

Ohne Verwendung [FromURI] (POST-Abfragen mit query-strings?), wie kann ich Beiträge von mehreren Parametern oder komplexe Objekte ohne Konvertierung diese Parameter in einem einzigen POCO-Klasse?

Ich weiß, das ist nicht das, was du hören willst, aber out of the box ist das nicht möglich. Es ist keine Beschränkung des browser-code, der die Anforderung stellt. Dies bedeutet, es spielt keine Rolle, wenn Sie mit Angular, JQuery, gerade JavaScript, oder sogar RestangularJS. Dies ist eine Einschränkung (ich benutze das Wort Locker, wie ich bin sicher, dies ist by design) der Web-API (in jeder version). Hier ist die Dokumentation zu diesem design: Parameterbindung in ASP.NET Web-API von Mike Wasson.

Maximal ein parameter erlaubt ist, zu Lesen, aus dem Nachrichtentext. Also das wird nicht funktionieren:

//Caution: Will not work!
public HttpResponseMessage Post([FromBody] int id, [FromBody] string name) { ... }

So wird die Frage, was sind Ihre Optionen?

Ein Modell erstellen

Dies ist die Sache, die Sie versuchen zu vermeiden, aber ich Liste es zuerst, weil das ist, wie Web-API gedacht war, zu Verhalten. Ich habe noch nicht gehört, einen zwingenden Grund, dies nicht zu tun. Dieser Ansatz ermöglicht es Ihnen, erweitern Sie Ihr Modell einfach ohne Veränderung der Signatur der Methode. Es ermöglicht auch die Validierung des Modells auf das Modell selbst. Ich persönlich mag diesen Ansatz.

public class SignInModel{
    public string Email {get;set;}
    public string Password {get;set;}
}

[HttpPost]
[Route("signin")]
public async Task<IActionResult> Signin(SignInModel signInModel)
{
       //....
}

Ich nicht wiederholen, Ihre vorhandenen JavaScript-code, weil das, was Sie arbeiten, ist wie mit den oben genannten web-api-code

URL

Wieder, was Sie versuchen zu vermeiden. Das macht, was Sie möchten möglich, mit der Einschränkung, dass Sie haben, übergeben Sie diese Parameter über den Query-string der URL. Das JavaScript würde sich ändern, aber die Signatur, die Sie hatte, auf der Web-API-Methode nicht.

public signin(inputEmail: string, inputPassword: string): Observable<Response> {
    return this.http.post('/api/account/signin/?email=inputEmail&password=inputPassword', null, this.options);
}

Ich nicht wiederholen, Ihre vorhandenen Web-API-code, weil das, was Sie arbeiten, ist wie mit den oben genannten web-JavaScript-code (standardmäßig FromUri wird davon ausgegangen, glaube ich)

Benutzerdefinierte Binder Modell

Sehen Die übergabe mehrerer POST-Parameter an die Web-API-Controller-Methoden von Rick Strahl. Diese option ermöglicht das erstellen einer custom-Modell, Sammelmappe, konnte tun, was Sie Fragen. Es ist eine ganze Reihe von extra-code, obwohl für die, IMHO, nicht viel nutzen. Vielleicht gibt es Situationen, wo es nützlich wäre, obwohl ich wirklich nicht glaube, jeder aus der Spitze von meinem Kopf.

Dynamische

Schließlich könnte man auch in ein dynamic - Objekt als parameter der Web-API. Dies ist im wesentlichen der gleiche wie empfangen der JSON als string und macht Ihre Controller-code verantwortlich für die Deserialisierung von Inhalten. Wieder, ich glaube, das würde machen den code schlechter, in den meisten Situationen, die Sie implementieren müssen, um die benutzerdefinierte Validierung und Typ-Prüfungen. Diese Antwort wurde vorgeschlagen zuvor auf SO von Bes Ley. Wieder, vielleicht gibt es Situationen, wo es nützlich wäre, obwohl ich wirklich nicht glaube, jeder aus der Spitze von meinem Kopf.

Vielleicht sollte man post mit Optionen:

{ 
   headers: new Headers({
   'Content-Type': 'application/x-www-form-urlencoded'
   })
}

und Daten zu verschlüsseln, wie

jQuery.param({user:'bla', password: 'bla'});

Habe ich das Problem der Angular2 HTTP Post ASP.NET MVC-Web-API

let headers = new Headers();
headers.append('Content-Type', 'application/x-www-form-urlencoded; charset=utf-8');
let params: URLSearchParams = new URLSearchParams();
params.set('value', '2');

let options = new RequestOptions({
    headers: headers//,
    //search: params
});
let content = new URLSearchParams();
content.set('StudentName', 'Inderjit Singh';
content.set('Mobile', '+919041165398');            
content.set('Nationality', 'Indian');
content.set('AdmissionNo', '6');
content.set('SectionCode', '1');
content.set('Gender', 'Male');
content.set('RegNo', '18585');
content.set('ClassCode', '1');
this.http.post('YOUR_URL', content.toString(), { headers: headers }).map((res: Response) => { console.log("data is==>" + res.text()); }).subscribe();

Versuchen Sie dieser, vorbei an einem komplexen Objekt der Klasse in einen einzigen data-parameter.

var SearchQuery = function () {
    this.Alphabet = null;
    this.Search = false;
    this.Keyword = null;
    this.RegionList = null;
};
var para = new SearchQuery();
{ data: JSON.stringify(para) } - Post Data

erhalten Sie es mit einem JObject in Ihrem API-controller und Deserialisieren von es als nach Ihren Klassen.