CODEWITHSUNDEEP
angulartypescripteventsionic3counter
farahm
farahm

Reputation: 1326

Angular counter trigger event

Typescript:

 countDown;
 counter = 10;
 tick = 1000;    

 this.countDown = Observable.timer(0, this.tick)
  .take(this.counter)
  .map(() => --this.counter)

And in HTML:

  <div>
    <h1>Time left</h1>
    <h2>{{countDown | async | formatTime}}</h2>
  </div>

How can I trigger an event wehen counter hits 0?

Upvotes: 0

Views: 707

Answers (1)

user4676340
user4676340

Reputation:

Try this

this.countDown = Observable
  .timer(0, this.tick)
  .take(10)
  .filter(value => value === 0)
  .do(() => {})

You can also use this because you used take

this.countDown = Observable
  .timer(0, this.tick)
  .take(10)
  .map(() => --this.counter)
  .finally(() => {})

EDIT For version 6 : 

this.countDown = timer(0, this.tick)
  .pipe(
    take(this.counter),
    map(() => --this.counter),
    finalize(() => /* your event */),
)

this.countDown = timer(0, this.tick)
  .pipe(
    take(this.counter),
    map(() => --this.counter),
    filter(value => value === 0),
    tap(() => /* your event */),
)

Upvotes: 1

Related Questions