ng-file-upload 文件 type/size 验证多个 ng-messages

Question

下面是我的代码，用于显示一个文本框和旁边的一个按钮，用于使用 ng-file-upload 上传文件。我试图显示相应的验证错误消息，如必填字段、文件大小限制和可接受的文件类型。我能够成功显示必填字段和文件大小的错误消息，但不能显示可接受的文件类型，这意味着

<div ng-message="accept">File format must be {{ vm.fileaccept }}</div> 无效。我在控制器中将 vm.fileaccept 设置为 vm.fileaccept = '.pdf,image/*';

<form name="uploadForm" ng-submit="vm.submitFile()" novalidate>
<div layout="row" flex="100">
<div layout="column" flex="95">
    <md-input-container>
        <input type="text" readonly name="filename"
               class="form-control" ng-model="vm.filename" required/>
        <div class="errors"
             ng-show="uploadForm.$submitted || uploadForm.filename.$dirty"
             ng-messages="uploadForm.filename.$error">
            <div ng-message="required">Required</div>
        </div>
        <div class="errors"
             ng-show="uploadForm.file.$error"
             ng-messages="uploadForm.file.$error">
            <div ng-message="maxSize">File size cannot exceed 1MB</div>
            <div ng-message="accept">File format must be {{ vm.fileaccept }}</div>
        </div>
    </md-input-container>
</div>
<div layout="column" flex="5">
    <md-input-container>
        <button
                ngf-select="vm.selectFile($file, $invalidFiles)" ng-model="file"
                name="file" ngf-accept="vm.fileaccept" ngf-pattern="vm.fileaccept"
                ngf-min-height="100" ngf-max-size="1MB">
            <i class="fa fa-folder-open-o"></i></button>
    </md-input-container>
</div>
</div>
</form>

Answer 1

我不知道确切原因，以下更改有效。

<div ng-message="accept">File format must be {{ vm.fileaccept }}</div>

到

<div ng-message="pattern">File format must be {{ vm.fileaccept }}</div>

ng-file-upload 文件 type/size 验证多个 ng-messages

ng-file-upload file type/size validations with multiple ng-messages

angularjs

angular-material

ng-file-upload

ng-messages