Угловая загрузка файла JS ng

Question

Я использую известную директиву загрузки файла Angler JS (https://github.com/danialfarid/ng-file-upload) в проекте, над которым я работаю, но у меня проблемы с проверкой. Я добавил директиву ngf-pattern, чтобы пользователи не загружали определенные форматы файлов. Это работает хорошо, и каждый недопустимый файл доступен в массиве $ invalidFiles. Есть ли способ очистить этот массив?

Я использую массив $ invalidFiles, чтобы обнаружить, когда использовался недопустимый файл, и предупредить пользователя. Файл не отображается в пользовательском интерфейсе и не добавлен в мою модель, но я не могу отправить форму, потому что форма недействительна. только после того, как я добавлю действительный файл, я могу отправить форму. Есть ли способ обнаружить недопустимые файлы, но все еще можно отправить форму?

Надеюсь, что я был чист .. Спасибо!

Answer 1

Возможно, что вам действительно нужно ngf-change, а затем ngf-select. На основе документации функция обработчика, назначенная директиве ngf-change, будет вызываться всякий раз, когда вы выбираете, отбрасываете или очищаете.

Если единственное, чего вы хотите достичь, это разрешить отправку формы независимо от того, является ли она действительной или недействительной, другой подход будет использоваться на ng-model-options. Существует опция, называемая allowInvalid, по умолчанию она равна false, установите ее в true, чтобы сделать трюк.

Таким образом, в вашем примере:

<button name="bla" multiple accept="image/*"    
     ngf-keep="true" 
     ng-model="myFiles" 
     ngf-pattern="'image/*'" 
     ngf-max-size="1MB" 
     ngf-change="handleFiles($files, $invalidFiles)" 
     ngf-model-options="{allowInvalid: true}"> 
    Select Files 
</button> 

Обратите внимание на последние две директивы мы изменили здесь.

Для полной справки, вы можете проверить официальный документ на участке Full reference - File select and drop

Answer 2

Является ли это то, что вам нужно: JsFiddle

$scope.submit = function() { 
    alert('form is ready'); 
    }