Length of observable array using 'as' syntax

Question

"@angular/core": "^6.1.4"

Here is my .html:

  <div *ngIf="errors$ | async as errors">
    <div class="container alert alert-danger" *ngIf="errors.length > 0">
      <b>{{errors.length}} error(s)</b>
      <ul *ngFor="let error of errors">
        <li>{{error}}</li>
      </ul>
    </div>
  </div>

My question is: can I reduce it down to a single *ngIf?

I have tried the following:

(errors$ | async as errors).length > 0
(errors$ | async as errors) && errors.length > 0

Both of these gave a template parse error.

I have already looked at How to check the length of an Observable array, this question is different because I want to use as syntax.

All I want to do is subscribe to the observable with the as syntax and only show this div if the length of the array is greater than 0. Any help would be appreciated!

Derviş Kayımbaşıoğlu · Accepted Answer · 2018-12-10T21:59:22.270

3

how about this

*ngIf="(errors$ | async)?.length > 1 && (errors$ | async)?.length < 5"

or

*ngIf="(errors$ | async)?.length > 0 && (errors$ | async) as errors">

Update

there is an issue for this on github. please see the link. Obviously this behaviour is not yet supported.

edited Dec 10 '18 at 21:59

answered Dec 10 '18 at 21:44

Derviş Kayımbaşıoğlu

28,492
4
50
72

1

Cool this works, but I want to avoid multiple async pipes on the same object – obl Dec 10 '18 at 21:48
I am also thinking that. If I find proper solution I will update my post :) – Derviş Kayımbaşıoğlu Dec 10 '18 at 21:49
Thanks! I appreciate your answer nonetheless. – obl Dec 10 '18 at 21:50
you may also consider to use share() operator within rxjs library which can help you to eliminate multiple server request using same observable service – Derviş Kayımbaşıoğlu Dec 10 '18 at 21:52
If my answer is helpful for you, please consider to upvote and/or accept it as answer. regards – Derviş Kayımbaşıoğlu Dec 10 '18 at 21:59
1

Accepting this answer as it looks like this is a current feature request on Angular's official GitHub. – obl Dec 10 '18 at 22:09

Length of observable array using 'as' syntax

1 Answers1