angular - Làm thế nào để gửi dữ liệu lên server trong Angular2?

onChange(event) {
    var image = event.srcElement.files;
    console.log(image);

Giá trị bảng điều khiển của tôi là

FileList {0: File, length: 1}

Tôi nên gửi gì đến máy chủ như dữ liệu bài đăng của mình?

Câu trả lời #1

Tôi giả sử event.srcElement thực sự là <input type="file"> vì bạn đang truy cập thuộc tính files của nó, thuộc tính này chỉ có sẵn ở các trường nhập liệu file.

Dịch vụ Http của Angular2 hiện tại chỉ hoạt động với các nội dung dạng chuỗi. Có một vấn đề đang mở để hỗ trợ cả FormData điều này sẽ làm mọi thứ đơn giản hơn rất nhiều.

Xem tính năng(http): Hỗ trợ nhiều loại body trên Request/Response và tất cả các triển khai ConnectionBackend.

Ngay bây giờ, bạn có thể sử dụng đối tượng XMLHttpRequest thô được bao bọc bởi NgZone để gửi dữ liệu POST dưới dạng FormData.

Tuy nhiên, có lẽ giải pháp thậm chí dễ dàng hơn cho bạn là gửi tệp dưới dạng chuỗi mã hóa base64:

onChange(event) {
    var image = event.srcElement.files[0];
    var reader = new FileReader();
    reader.onload = (evt) => {
        // Print base64 encoded file content
        console.log(evt.target.result);
        // Send data to server
        this.http.post(url, evt.target.result)...
    }
    reader.readAsDataURL(image);
}

Để biết thêm thông tin, xem:

• Làm thế nào để bạn POST một đối tượng FormData trong Angular 2?
• Đọc nội dung tệp trên phía client trong javascript trên nhiều trình duyệt
• http://www.w3schools.com/ajax/ajax_xmlhttprequest_create.asp

Câu trả lời số 2

Một thứ gì đó như:

return this.http
      .post(this.heroesUrl, JSON.stringify({name: name}), {headers: this.headers})
      .toPromise()
      .then(res => res.json().data)
      .catch(this.handleError);

là hoàn hảo, bạn có mọi thứ bạn cần tại https://angular.io/docs/ts/latest/tutorial/toh-pt6.html