將圖像發送到API控制器angularjs

我有這個我的HTML頁面上將圖像發送到API控制器angularjs

<div class="form-group col-xs-7 col-lg-6"> 
    <label>Background image</label> 
    <input type="file" name="background_image" id="background_image" ng-model="selectedLayout.background_image" class="form-control" /> 
    <button class="btn btn-primary" ng-click="save(selectedLayout)">Change background image</button> 
</div>

這是我在控制器

$scope.save = function (selectedLayout) { 
    $http({ 
     method: 'POST', 
     url: 'api/LayoutSettings/PostImage', 
     data: selectedLayout.background_image, 
     headers: { 
      'Content-Type':'image/jpeg' 
     } 
    }); 
};

這是我在指定的API控制方法LayoutSettings

public async Task<HttpResponseMessage> PostImage() 
{ 
    if (!Request.Content.IsMimeMultipartContent()) 
    { 
     throw new HttpResponseException(HttpStatusCode.UnsupportedMediaType); 
    } 

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

    try 
    { 
     await Request.Content.ReadAsMultipartAsync(provider); 
     return Request.CreateResponse(HttpStatusCode.OK); 
    } 
    catch (Exception e) 
    { 
     return Request.CreateErrorResponse(HttpStatusCode.InternalServerError, e); 
    } 
}

我不知道爲什麼當我實際按下更改背景圖像時我發送一個空的對象。有人有一些想法，我怎麼能真正傳遞圖像？謝謝。

來源

2015-08-18 RobertRPM

NG-模型不是通過輸入[文件]類型支持，但在它的角文檔的說明：

注：不提供的所有功能適用於所有輸入類型。具體而言，通過ng-model的數據綁定和事件處理是不支持輸入[文件]。

嘗試this而不是。

來源

2015-08-18 14:02:42 tombarti

謝謝，這解決了我的問題。 – RobertRPM

將圖像發送到API控制器angularjs

回答

相關問題