Alexey Kuzmin

Твой путь ng-file-upload

$scope.choiceFile = () ->
    partsName = $scope.file.name.split('.')
    partsName.pop()
    $scope.file.humanName = partsName.join('.')
    
    $scope.file = _.extend $scope.file,
        progress: 0
        isUploading: false
        isError: false
        isComplete: false

$scope.uploadFile = (file) ->
    file.isUploading = true

    Upload.upload(
        url: '/api/file/'
        data:
            file: file
            param1: 1
            param2: 2
    ).then( (resp) ->
        file.isComplete = true
        console.log "успешно загружен #{file.name}"
    , (resp) ->
        file.isError = true
        console.log "Ошибка при загрузке #{file.name}"
    , (evt) ->
        file.progress = parseInt(100.0 * evt.loaded / evt.total)
    )

<button ngf-select
        class="btn btn-info hidden-lg hidden-md"
        accept="*/*"
        ngf-pattern="*/*"
        ngf-change="choiceFile()"
        ng-model="file">
    Choice to upload
</button>

PS: пример на Coffee Script позволит сориентироваться с readme к библиотеке

Поля files нет в модели, и атрибут read_only=True как бы намекает нам, что не следует искать его у модели. Если его удалить, то будет валиться с такой ошибкой:

Got AttributeError when attempting to get a value for field `files` on serializer `ProductSerializer`.
The serializer field might be named incorrectly and not match any attribute or key on the `Product` instance.
Original exception text was: 'Product' object has no attribute 'files'.

Если удалить 'files' из кортежа fields, то будет вот так:

The field 'files' was declared on serializer ProductSerializer, but has not been included in the 'fields' option.