4

Whenever i use the async pipe i am getting console errors.

   <component *ngFor="#c of columns | async" [column]="c"></component>

I get this console error:

EXCEPTION: Invalid argument '[object Object]' for pipe 'AsyncPipe' in [columns | async in Projects@1:51] browser_adapter.js:76 EXCEPTION: Invalid argument '[object Object]' for pipe 'AsyncPipe' in [columns | async in Projects@1:51]

Is there something missing?

1
  • Can you please add the code of column? Commented Jan 9, 2016 at 12:26

1 Answer 1

4

The columns attribute must be either an observable or a promise (not an array or something else. See this line in the source code of Angular2 (AsyncPipe class): https://github.com/angular/angular/blob/master/modules/angular2/src/common/pipes/async_pipe.ts#L109.

In the case of an HTTP call for example, you need to set the columns attribute with the returned observable directly. The async will be responsible to handle it, i.e. calling its subscribe method, dispose it. Here is a sample:

this.columns = 
   this.http.get('https://angular2.apispark.net/v1/companies/', {
     headers: headers
   }).map(res => res.json());

Instead of setting the `columns attribute from a subscribe method you manage by yourself:

this.http.get('https://angular2.apispark.net/v1/companies/', {
  headers: headers
})
.map(res => res.json())
.subscribe(data => this.columns = data);

Hope it helps you, Thierry

Sign up to request clarification or add additional context in comments.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.