Does Angular support an *ngWhile microsyntax?

Question

How would I go about writing a while loop, doing the equiv of

while (x--) {
  <li> foo {{x}} </li>
}

with a "microsyntax" similar to *ngFor but for looping with an incrementer or decrementer rather than over an object. So if component has x = 5. And I want

<li> foo 5 </li>
<li> foo 4 </li>
<li> foo 3 </li>
<li> foo 2 </li>
<li> foo 1 </li>

Or the like. Template Toolkit does this with WHILE. I'm looking for that kind of functionality. So does jade/Pugs.

@AniruddhaDas right, I want to loop in templates with a while. — Evan Carroll, Sep 08 '17 at 20:25
@AniruddhaDas not afaik. Feel free to show me how, if it is. ngFor loops over iterators as far as I can see. — Evan Carroll, Sep 08 '17 at 20:28
@AniruddhaDas that's assuming foo's is an iterator, what it it's the number `5`? — Evan Carroll, Sep 08 '17 at 20:29
I dont think there is while loop in template, you need to convert your while loop in your component and then iterate that in templage. and I am sure you are not look that. — Aniruddha Das, Sep 08 '17 at 20:43
Possible duplicate of [Angular 2 - NgFor using numbers instead collections](https://stackoverflow.com/questions/36354325/angular-2-ngfor-using-numbers-instead-collections) — GreyBeardedGeek, Sep 09 '17 at 06:01

score 0 · Answer 1 · answered Sep 08 '17 at 20:42

0

If you want to count up, *ngFor has an index value available to you. I am not aware of a way to count downwards though.

<li *ngFor="let foo of foos; let i = index">
 foo {{i}}
</li>

Output:

foo 0
foo 1
foo 2
foo 3
foo 4

answered Sep 08 '17 at 20:42

tylerwgrass

656
4
19

Can you show what you're setting `foos` too? Is that foos=5? – Evan Carroll Sep 08 '17 at 20:48
It's a collection of your choice. If you are looking to do this with just a number of times you want to increment, there is unfortunately no easy way to do this. See [this question.](https://stackoverflow.com/questions/36354325/angular-2-ngfor-using-numbers-instead-collections) – tylerwgrass Sep 08 '17 at 20:54
Well, I was really looking for an ngWhile or the like, not to force this to work with ngFor =( – Evan Carroll Sep 08 '17 at 20:55
ngFor is the only type of templating loop. So you might just be stuck using it. Maybe if you provide more details about your specific problem someone could provide a better approach for your situation? – tylerwgrass Sep 08 '17 at 20:59
I'm trying a list of elements from a counter. I feel like I could [do this in the 1950s with perl](http://www.template-toolkit.org/docs/manual/Directives.html#section_WHILE) – Evan Carroll Sep 08 '17 at 21:02

score 0 · Answer 2 · answered Dec 12 '18 at 15:30

0

It loops through an array, put whatever you want in the array's functions:

<li *ngFor="let foo of foos.slice(0, 5)">
 foo {{i}}
</li>

answered Dec 12 '18 at 15:30

bjolfr

11
1

Does Angular support an *ngWhile microsyntax?

2 Answers2