python ruby-programming-language Smalltalk Vue.js Knockoutjs TypeScript JavaScript, OOPs JavaScript Angular 7, Interview Questions Angular 8,7,6,5,4 and 2 Interview Questions and Answers Angular 8,7,6,5,4 and 2 Interview Questions and Answers Angular 4 Angular 2 AngularJs 1.x NodeJs Perl Programming R Programming RequireJs Rust Programming Backbonejs closure programming language go-programming-language kotlin-programming-language

What Is Angular AsyncPipe?

Angular AsyncPipe –
Angular provide a special kind of pipe that are called AsyncPipe and the AsyncPipe subscribes to an observable or promise and returns the latest value it has emitted.

The AsyncPipe allows you to bind your HTML templates directly to values that arrive asynchronously manner that is a great ability for the promises and observables.

The expression with Async pipe-
{{ obj_expression | async }}

<ul><li *ngFor="let account of accounts | async">{{account.ACNo }}</li></ul>

The object expression can be observable, promise, null, or undefined.

The example for AsyncPipe -
  selector: 'app-async-pipe',
  template:`<ul><li *ngFor="let account of accounts | async">  A/C No- {{account.ACNo }} </li></ul>`,
  styleUrls: ['./async-pipe.component.css']
export class AsyncPipeComponent implements OnInit {
accounts = [];//accounts declarations
apiURLstring = ''//fetching json data from Rest API

//AsyncPipe Component constructor
constructor(private accountServiceAccountService) { }

//Load the account list
ngOnInit() {
                        .subscribe(data => this.accounts = data);

For more detail kindly refer this link click…

Hi there! Welcome to my blog. My name is Anil Singh. I'm a author of this blog. For more detail about me, kindly refer to this link..
My Blogs - and
My Books - Interview Questions and Answers Books- Get Your Book in 15+ Digital Stores Worldwide..

You Might Also Like Powered by Blogger.
ASK Questions