Я пытаюсь отобразить базу изображений из введенного пользователем URL-адреса. Это работает для успешных случаев. Но когда я пытаюсь ввести URL-адреса XSS, событие onError
тега img
не вызывается в FireFox. (работает на Chrome и IE)
Вот мой URL-адрес приложения stackblitz: https://angular -dwlzbn.stackblitz.io
Вы можете просмотреть его на Chrome и Firefox для проверки.
Я тестирую XSS URL, например:
Мне нужна помощь, чтобы отловить ошибку даже при использовании FireFox. Мой реальный код использует спиннер, и я прячу его, когда вызывается onerror
. Так что в Firefox блесна заклинило.
Вот мой HTML:
<form #testForm="ngForm">
<div>
<mat-form-field>
<input matInput type="URL" placeholder="Type Url Here" name="image" #image="ngModel" [(ngModel)]="imageUrl" />
<mat-error *ngIf="image.invalid && (image.dirty || image.touched)">
<div *ngIf="image.errors.invalidImage">Image is invalid.</div>
</mat-error>
</mat-form-field>
</div>
<div class="header-image-preview">
<img *ngIf="!!imageUrl" [src]="imageUrl" (load)="onImageLoad()" (error)="onImageError()" />
</div>
</form>
и вот часть моего файла TS:
imageUrl: string;
@ViewChild(NgForm) testForm: NgForm;
public onImageLoad() {
this.testForm.controls['image'].setErrors(null);
}
public onImageError() {
this.testForm.controls['image'].setErrors({ 'invalidImage': true });
}
Вы можете просмотреть весь пример кода здесь: https://stackblitz.com/edit/angular-dwlzbn