Отправить изображение на контроллер API с Angularjs

0

У меня это на моей странице html

<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);
    }
}

Я не знаю, почему, когда я действительно нажимаю фоновое изображение изменения, я посылаю пустой объект. У кого-то есть идея, как я могу передать изображение? Благодарю.

Теги:

1 ответ

0
Лучший ответ

ng-model не поддерживается типом ввода [файла], в Угловых документах есть примечание:

Примечание. Не все предлагаемые функции доступны для всех типов ввода. В частности, привязка данных и обработка событий с помощью ng-модели не поддерживаются для ввода [файл].

Попробуйте это вместо этого.

  • 0
    Спасибо, это решило мою проблему.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню