CODEWITHSUNDEEP
angularobservableangular-pipe
孟子易
孟子易

Reputation: 383

How do I get a value after pipe complete?

For example. I want Angular auto update the value (using observable).

// in test.component.ts
ngOnInit(){
  let i = 0;
  this.test = new Observalble<any>((ob) => {
    setInterVal(() => {
      ob.next({
        i: i++,
      })
    },1000);
  });
}

<!-- in test.component.html -->
<p>{{ (test | async).i }}</p> <!-- not work -->
<p>{{ (test.i | async) }}</p> <!-- not work -->

Upvotes: 0

Views: 236

Answers (1)

user184994
user184994

Reputation: 18281

You'll need to fix your spelling errors first: setInterVal should be setInterval (lower case v), and Observalble should be Observable.

Then, you need to add the null safe operator, as the async result of test will start out undefined, and cause errors if you try get the i property from an undefined value. By adding the ?, it will only try to read i if test | async is not null.

// in test.component.ts
ngOnInit(){
  let i = 0;
  this.test = new Observable<any>((ob) => {
    setInterval(() => {
      ob.next({
        i: i++,
      })
    },1000);
  });
}

<!-- in test.component.html -->
<p>{{ (test | async)?.i }}</p> <!-- not work -->

Here is a StackBlitz demo

Upvotes: 2

Related Questions