Проверьте тип загрузки файла в PrimeNG и Angular - PullRequest
0 голосов
/ 07 ноября 2019

Я пытаюсь ограничить тип файла, который пользователь может загрузить. Я могу только разрешить PDF и док. Мой HTML имеет следующий код:

<input #pdfUploadID type="file" id="fileUploadID" formControlName="fileUploadID" (change)="handleFileInput($event.target.files, 'id')" accept=".pdf,.doc">

. Одно только это позволяет пользователю изменять разрешенные типы во всплывающем окне браузера, как показано ниже enter image description here

ТакУ меня есть пользовательский код, который проверяет тип файла после того, как пользователь загружает, как показано ниже:

if (this.fileToUploadID.type !== 'application/pdf') {
   this.isPDFId = false;
} else { this.isPDFId = true; }

Моя проблема заключается в том, когда я пытаюсь добавить еще один тип в оператор if, как это, я получаю следующую ошибку

Это условие всегда будет возвращать true, так как типы «application / pdf» и «application / msword» не имеют перекрытия.

 if ((this.fileToUploadID.type !== 'application/pdf')||(this.fileToUploadID.type !== 'application/msword')) {
    console.log("file type: "+this.fileToUploadID.type);
    this.isPDFId = false;
 } else { this.isPDFId = true; }

Любые идеичто я должен добавить?

Ответы [ 3 ]

1 голос
/ 08 ноября 2019

Я проверил документацию PrimeNG об интерфейсе File и похоже, что File.type напечатано как строкаПохоже, что вы могли бы присвоить этому свойству другое значение типа, однако без полного предварительного просмотра компонента это трудно сказать.

Только что произошла ошибка при сравнении строки с числом:

value === 1 ? true : false

Это условие всегда будет возвращать «ложь», так как типы «строка» и «1» не имеют перекрытия. Tts (2367)

Смена ошибки выше на убранную ниже:

value === '1' ? true : false

Если вы не нашли причину своей проблемы, попробуйте преобразовать значение в строку, используя .toString() при сравнении:

this.fileToUploadID.type.toString() === 'application/pdf' && this.fileToUploadId.type.toString() === 'application/msword' ? true : false;

Однако это также следует решить с помощью операторов нестрого сравнения, которые@StefanN предложил.

0 голосов
/ 07 ноября 2019

fileTypes: any = [
   {type: 'application/msword', name: 'Doc'},
   {type: 'application/pdf', name: 'Pdf'}
];
fileType: string;

handleFileInput(event){
  const files = event.target.files;
  const mimeType = files[0].type;
  
  if(mimeType !== this.fileType) {
    alert(`please select a ${this.fileType} file`);
  }
  
}
<input type="file" id="fileUploadID" (change)="handleFileInput($event)" accept=".pdf,.doc"> 

<select [(ngModel)]='fileType'>
  <options *ngFor="let type of fileTypes">{{type.name}}</options>
</select>
0 голосов
/ 07 ноября 2019

просто замените ваш оператор if следующим:

this.isPDFId = this.fileToUploadID.type === 'application/pdf' && this.fileToUploadId.type === 'application/msword' ? true : false;
...