How to delay an Angular7 pipe observable to run after 2 seconds

Asked Jan 23 '19 at 03:49

Active Jan 23 '19 at 14:38

Viewed 451 times

I want to delay this pipe to return value only after 2 seconds.

What would be the idyllic way to delay such observable pipe.

export class StoragePipe implements PipeTransform {
    constructor(private afStorage: AngularFireStorage) { }
    transform(path: string): Observable<string> {
        if(path){
            return this.afStorage.ref(path).getDownloadURL();
       }

    }
}

I tried something like this return this.afStorage.ref(path).getDownloadURL().pipe(delay(2000)); That doesn't seem to work.

edited Jan 23 '19 at 14:38

KENdi

7,576
2
16
31

asked Jan 23 '19 at 03:49

LearnToday

2,762
9
38
67

I`m not sure you can do it, but there are many other ways to do what you want to do. You can for instance just show what you want to show and after 2 secs (settimeout) run over all your array(what ever) and then transform it with your pipe. – Talg123 Jan 23 '19 at 04:12
2

What does `getDownloadURL()` return? Observable? – Amit Chigadani Jan 23 '19 at 04:30
Possible duplicate of https://stackoverflow.com/questions/42413969/how-can-i-create-an-observable-with-a-delay – Deepak Agarwal Jan 23 '19 at 04:32
I don't think this is a best solution. See, the reason why I think this won't work is for the following. The time will be different based on the size of the file you are uploading to firebase storage. Sometimes it's almost instant, sometimes takes several seconds. – Patricio Vargas Jan 23 '19 at 05:44
I asked a similar question before. I ran into the same issue..hope you find the solution https://stackoverflow.com/questions/52918032/waiting-for-observable-to-finish-angular – Patricio Vargas Jan 23 '19 at 05:47
@AmitChigadani it returns an observable. – LearnToday Jan 23 '19 at 05:47
@AmitChigadani it does return an observable – Patricio Vargas Jan 23 '19 at 05:48
have you tried ``throttleTime()`` ? – CruelEngine Jan 23 '19 at 05:53
@CruelEngine yeah, I did. – LearnToday Jan 23 '19 at 05:58
@LearnToday that didn't work ? – CruelEngine Jan 23 '19 at 05:59
@CruelEngine No, it didn't work. ``return this.afStorage.ref(path).getDownloadURL().pipe(throttleTime(5000));`` – LearnToday Jan 23 '19 at 06:02
@LearnToday try this : ``return this.afStorage.ref(path).getDownloadURL().pipe(timer(5000));`` – CruelEngine Jan 23 '19 at 06:08
@CruelEngine Observable ``timer`` is not assignable to ..... – LearnToday Jan 23 '19 at 06:11
@LearnToday sorry was wrong in the implementation , you'll have to subscribe to the timer and then subscribe your observable . something like this : ``timer(5000).pipe( takeWhile(//make condition false here to stop emitting ), // do my operation));`` – CruelEngine Jan 23 '19 at 06:17
@LearnToday have created a stackblitz example : https://stackblitz.com/edit/angular-fuazpy – CruelEngine Jan 23 '19 at 06:40
Thanks @CruelEngine. I'll check that out! – LearnToday Jan 23 '19 at 12:08

How to delay an Angular7 pipe observable to run after 2 seconds

0 Answers0