Wie zum senden von Formular Daten in eine http-post-Anforderung von Winkel 2?

Ich versuche zum senden von Formular-Daten der aktualisierten Benutzer-details zum back-end die Knoten server im Winkel 2,Aber ich konnte nicht senden der Formular-Daten und der server antwortet mit status 500,In angularjs ich auch schon sowas gemacht haben,
service-Datei

  update: {
    method: 'POST',
    params: {
      dest1: 'update'
    },
    transformRequest: angular.identity,
    'headers': {
      'Content-Type': undefined
    }
  }

Im controller als

var fd = new FormData();
var user = {
  _id: StorageFactory.getUserDetail()._id,
  loc: locDetails
};
fd.append('user', angular.toJson(user));
UserService.update(fd).
$promise.then(
  function(value) {
    console.info(value);
    updateUserDetailsInStorage();
  },
  function(err) {
    console.error(err);
  }
);

Konnte ich nicht herausfinden, wie man dies tun, im Winkel 2 Winkel.toJson,eckig.Identität und transformrequest Funktionen sind nicht verfügbar, im Winkel 2,
bisher habe ich Folgendes getan, im Winkel 2,

 let fd = new FormData();
 let user = {
   _id: this.appManager.getUserDetail()._id,
   loc: locDetails
 };
 fd.append('user', JSON.stringify(user));
 this.userService.update(fd).subscribe((value) => {
   console.log(value);
   this.updateUserDetailsInStorage();
 }, (err) => {
   console.error(err);
 });

http-service-Datei

update(body) {
  console.log('update', body);
  const headers = new Headers({
    'Content-Type': undefined
  });

  const options = new RequestOptions({
    headers: headers
  });
  return this.http.post(`${app.DOMAIN}` + 'user/update', body, options)
    .map((res: Response) => {
      res.json();
    }).do(data => {
      console.log('response', data);
    })
}

Ich habe viele Beiträge gelesen und versucht einige Dinge, aber so weit wird es nicht erfolgreich war, könnte mir jemand empfehlen, wie dies zu tun?

Wo sind Sie erfolglos genau? Hast du Fehler in der Konsole?
es gibt keine Konsole Fehler , der server antwortet mit status 500, während es funktioniert perfekt, wenn ich die gleiche Anwendung, die ich erstellt in angularjs
Wenn Sie sicher sind, dass die post-url korrekt ist, können Sie auch JSON.stringify der Körper variable, die Sie senden? Und vielleicht ändern Sie den 'Content-Type' , 'application/json'
Die Anfrage-payload ändert sich zu {}, wenn ich versuche, entweder von beiden oder beide

InformationsquelleAutor akila arasan | 2016-12-08

11

Können Sie add Header, wenn Eure server-controller erfordert es, sonst können Sie einfach buchen Sie es so
```
let body = new FormData();
body.append('email', 'emailId');
body.append('password', 'xyz');
this.http.post(url, body);
```
Ich bin verwirrt, zum Beispiel, wie kann ich senden Sie diese an: "&client_secret=" + "abc123" +"&username=" + user +"&password=" + pass;
siehe hier: stackoverflow.com/questions/45470575/...

InformationsquelleAutor Sahil Daga

Dies ist eine funktionale Lösung für den Aufbau einer POST-Anforderung in Angular2, die Sie nicht benötigen Sie einen Authorization-header.

var headers = new Headers();
headers.append('Content-Type', 'application/x-www-form-urlencoded');

let options = new RequestOptions({ headers: headers });

var body = "firstname=" + user.firstname + "&lastname=" + user.lastname + "&username=" + user.username + "&email=" + user.email + "&password=" + user.password;

return new Promise((resolve) => {
                this.http.post("http://XXXXXXXXXXX/users/create", body, options).subscribe((data) => {
                if (data.json()) {
                    resolve(data.json());
                } else {
                    console.log("Error");
                }
            }
        )
    });

Es ist eigentlich 'application/x-www-form-urlencoded' statt 'application/X-www-form-urlencoded'. Kleinbuchstaben X. ich war immer 400 Bad Request, bis ich es geändert.

InformationsquelleAutor Joffrey Outtier

Hier ist die Methode von meiner app, die einwandfrei funktioniert.

 updateProfileInformation(user: User) {
    this.userSettings.firstName = user.firstName;
    this.userSettings.lastName = user.lastName;
    this.userSettings.dob = user.dob;

    var headers = new Headers();
    headers.append('Content-Type', this.constants.jsonContentType);

    var s = localStorage.getItem("accessToken");
    headers.append("Authorization", "Bearer " + s);
    var body = JSON.stringify(this.userSettings);

    return this.http.post(this.constants.userUrl + "UpdateUser", body, { headers: headers })
      .map((response: Response) => {
        var result = response.json();
        return result;
      })
      .catch(this.handleError)
  }

Diese Antwort erscheint nicht zu erklären, wie POST-Formulardaten im besonderen. Das sieht aus wie ein request mit einem normalen stringified JSON Körper. Wo ist die Formular-Daten?

InformationsquelleAutor John Baird

Hier ist die Methode, die ich verwendet habe, im Winkel 4 zum hochladen von Dateien....
für Ui

   <input type="file"id="file"(change)="handleFileInput($event)">

und .ts-Datei habe ich Hinzugefügt ....

  handleFileInput(event) {
    let eventObj: MSInputMethodContext = <MSInputMethodContext> event;
    let target: HTMLInputElement = <HTMLInputElement> eventObj.target;
    let files: FileList = target.files;
    this.fileToUpload  = files[0];
    console.log(this.fileToUpload);
  }



 uploadFileToActivity() {
    console.log('Uploading file in process...!' + this.fileToUpload );
    this.fontService.upload(this.fileToUpload).subscribe(
      success => {
        console.log(JSON.stringify(this.fileToUpload));
        console.log('Uploading file succefully...!');
        console.log('Uploading file succefully...!' + JSON.stringify(success));
      },
      err => console.log(err),
    );
  }

und Dienstleistungen

upload(fileToUpload: File) {
    const headers = new Headers({'enctype': 'multipart/form-data'});
    //headers.append('Accept', 'application/json');
    const options = new RequestOptions({headers: headers});
    const formData: FormData = new FormData();
    formData.append('file', fileToUpload, fileToUpload.name);
    console.log('before hist the service' + formData);
    return this.http
      .post(`${this.appSettings.baseUrl}/Containers/avatar/upload/`, formData , options).map(
        res => {
          const data = res.json();
          return data;
        }
      ).catch(this.handleError);
  }

Diese Methode für das einzelne hochladen der Datei auf den server-Verzeichnis.

Während dieser code kann die Frage beantworten, die zusätzliche Bereitstellung von Kontext in Bezug auf, warum und/oder wie dieser code beantwortet die Frage, verbessert seine langfristige Wert.

InformationsquelleAutor muhammad zaman

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.