角2的Kendo UI上传组件 - 无法上传

Question

我是kendo ui for angular 2和web api（.net core）。我无法使用kendo上传将文件上传到web api。

这里是我的示例代码： HTML：

<kendo-upload [saveUrl]="uploadSaveUrl" 
          [removeUrl]="uploadRemoveUrl" 
          (upload)="uploadEventHandler($event)"> 
    </kendo-upload> 

上传事件处理

 uploadEventHandler(e: UploadEvent) 
    { 
     this.fs.uploadFile(e.files).subscribe(result => { console.log('result', result); }); 

    } 

上传服务：

uploadFile(file: any) 
{ 

    const baseUrl = this.basePath + '/api/Common/UploadFile'; 

    return this.dah.post(baseUrl, file); 
} 

的Web API：

[HttpPost("UploadFile")] 
    public string UploadFile(IList<IFormFile> files) 
    { 

     return ""; 
    } 

在这里，我不能在API的文件列表。有没有工作代码？

Answer 1

你没有说什么“this.dah”是的，但使用剑道上传'uploadFiles（）方法时，你可以在你的网络API服务通过[FromForm]属性访问您的文件：

[HttpPost("UploadFile")] 
public string UploadFile([FromForm]ICollection<IFormFile> files) 
{ 
    return ""; 
} 

Answer 2

<kendo-upload #myUpload="kendoUpload" [autoUpload]="false" [saveUrl]="'/api/Attachment/PostFormData'" (upload)="uploadEventHandler($event)"> </kendo-upload> 

component.ts

ploadEventHandler(e: UploadEvent) { 
     console.log(e.files[0].uid); 
     // you can send extra data here 
     e.data = { 
      attachmentType: this.typList.filter(x=>x.Uid == e.files[0].uid)[0].type 
     }; 
    } 

网络API控制器

[HttpPost] 
     public async Task<HttpResponseMessage> PostFormData() 
     { 
      // Check if the request contains multipart/form-data. 
      if (!Request.Content.IsMimeMultipartContent()) 
      { 
       throw new HttpResponseException(HttpStatusCode.UnsupportedMediaType); 
      } 

      string _property = System.Web.HttpContext.Current.Request.Form["attachmentType"]; 

      string root = HttpContext.Current.Server.MapPath("~/App_Data/uploads"); 
      var provider = new MultipartFormDataStreamProvider(root); 

      try 
      { 
       // Read the form data. 
       await Request.Content.ReadAsMultipartAsync(provider); 
       int i = 0; 
       // This illustrates how to get the file names. 
       foreach (MultipartFileData fileData in provider.FileData) 
       { 
        if (string.IsNullOrEmpty(fileData.Headers.ContentDisposition.FileName)) 
        { 
         return Request.CreateResponse(HttpStatusCode.NotAcceptable, "This request is not properly formatted"); 
        } 
        string fileName = fileData.Headers.ContentDisposition.FileName; 
        if (fileName.StartsWith("\"") && fileName.EndsWith("\"")) 
        { 
         fileName = fileName.Trim('"'); 
        } 
        if (fileName.Contains(@"/") || fileName.Contains(@"\")) 
        { 
         fileName = Path.GetFileName(fileName); 
        } 
        var ext = Path.GetExtension(fileName); 
        var uniqFileName = $@"{Guid.NewGuid() + "." + ext }"; 
        File.Move(fileData.LocalFileName, Path.Combine(root, uniqFileName)); 
        i++; 
       } 
       return Request.CreateResponse(HttpStatusCode.OK); 
      } 
      catch (System.Exception e) 
      { 
       return Request.CreateErrorResponse(HttpStatusCode.InternalServerError, e); 
      } 
     }