相关疑难解决方法(0)

如何在Angular 2中发布FormData对象?

我需要上传一个文件并发送一些json,我有这个功能:

POST_formData(url, data) {
        var headers = new Headers(), authtoken = localStorage.getItem('authtoken');

        if (authtoken) {
            headers.append("Authorization", 'Token ' + authtoken)
        }

        headers.append("Accept", 'application/json');
        headers.delete("Content-Type");

        var requestoptions = new RequestOptions({
            method: RequestMethod.Post,
            url: this.apiURL + url,
            headers: headers,
            body: data
        })

        return this.http.request(new Request(requestoptions))

        .map((res: Response) => {
            if (res) {
                return { status: res.status, json: res.json() }
            }
        })
    }
Run Code Online (Sandbox Code Playgroud)

我的问题是,如果我设置content-type为" multipart/form-data"我的服务器抱怨边界,如果我content-type完全删除标头,我的服务器抱怨它" text/plain"支持的媒体类型.

那么,如何使用angular2发送FormData?

file-upload typescript angular2-http angular

42
推荐指数
3
解决办法
9万
查看次数

Angular 2允许用户从本地机器中选择和成像

我对Angular很新.我正在尝试使用Angular 2创建一个简单的Web应用程序,我允许用户从本地计算机中选择和映像.然后我想在<img>标签中显示这个图像.稍后对图像执行操作,如旋转,更改比例,更改宽度等.

这就是我的组件中的内容

@Component({
    selector: 'image-container',
    template: `
        <input type="file" (change)="changeListner($event)" />
        <img id="image"/>
    `,
    directives: [ImageActionsComponent]
})
export class ImageContainerComponent { 
   // make FileReader work with Angular2
   changeListner(event){
        var reader = new FileReader();

        reader.onloaded = function (e) {
            // get loaded data and render thumbnail.
            var src = e.target.result;
            document.getElementById("image").src = src;
        };

        // read the image file as a data URL.
        reader.readAsDataURL(event.target.files[0]);
    }
}
Run Code Online (Sandbox Code Playgroud)

但它根本不起作用.如何使用Angular2读取图像并更新src属性?

我只是想学习Angular.:)

有没有更好更简单的方法来做到这一点?

angular2-forms angular2-template angular

5
推荐指数
1
解决办法
1万
查看次数

更新作为 Angular2 中 formArray 中的文件输入的 formControl

我有下面的代码:

import { Component, OnInit, ElementRef } from '@angular/core';
import { FormArray, FormBuilder, FormControl, FormGroup, Validators } from '@angular/forms'

@Component({
  selector: 'app-root',
    templateUrl: './app.component.html',
    styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit {
  showSort: boolean = false;
  form: FormGroup;
  name: FormControl;
  sortSelf: FormControl;
  sortItem: FormArray;
  locationItems: FormArray;

  constructor(private _fb: FormBuilder, private _elementRef: ElementRef ) {
  }

  ngOnInit(): void {
    this.sortItem = this._fb.array([this.initSort()]);

    this.form = this._fb.group({
      sortItem: this.sortItem
    });
  }

  initSort() {
    return this._fb.group({
      locationPicture: new FormControl('', []),
      locationItems: this._fb.array([
        this.initSortItems() …
Run Code Online (Sandbox Code Playgroud)

forms input angular

5
推荐指数
1
解决办法
1万
查看次数

如何使用Ionic 2上传图片

我正在使用Ionic 2和Django Rest Framework构建应用程序.我需要从画廊或相机拍摄照片并将此照片上传到我的服务器.

我有这个代码打开相机并拍照.

options = {}
Camera.getPicture(options).then((imageData) => {
    // imageData is either a base64 encoded string or a file URI
    // If it's base64:
    let base64Image = "data:image/jpeg;base64," + imageData;
}, (err) => {
}); 
Run Code Online (Sandbox Code Playgroud)

但我不知道它在哪里保存图片或如何将其发送到服务器.我在互联网上找不到任何东西.

谢谢

django django-rest-framework ionic-framework ionic2

4
推荐指数
1
解决办法
7389
查看次数