src/app/shared/widgets/upload/preview/image-reload.directive.ts
| selector | img[reload-on-error] |
Widget inputs |
Widget outputs |
Properties |
Methods |
Inputs |
constructor(changeDetector: ChangeDetectorRef)
|
||||||
|
Parameters :
|
src
|
Type: |
| onError |
onError()
|
|
Returns :
void
|
| Private retries |
retries:
|
Type : number
|
Default value : 0
|
| Private uri |
uri:
|
Type : string
|
import { ChangeDetectorRef, Directive, Input } from "@angular/core";
import { timer } from "rxjs";
declare var contextPath: string;
@Directive({
selector: "img[reload-on-error]",
host: {
"(error)": "onError()",
"[src]": "src",
},
})
export class ImageReloadDirective {
@Input() public src: string;
private uri: string;
private retries = 0;
constructor(private changeDetector: ChangeDetectorRef) {}
onError() {
if (this.retries > 3) {
this.src = contextPath + "/assets/file-image-outline.svg";
return;
}
this.retries++;
this.uri = this.src;
this.src = contextPath + "/assets/loading.svg";
timer(5000).subscribe(() => {
this.src = this.uri;
this.changeDetector.detectChanges();
});
}
}