how to loop with out a collection in angular 2

Question

I have a number and I want to iterate that number of times.

for (var _i = 0; _i < length; _i++)

I want to implement similar to this syntax in the html template. if i use ngFor then i will need to have a collection but I don't have collection, I just have length.

Possible duplicate of [How to iterate through angular $scope variables with a loop](http://stackoverflow.com/questions/17326796/how-to-iterate-through-angular-scope-variables-with-a-loop) — Muhammad Saqlain, Feb 25 '17 at 09:46
It's a possible duplicate of this..http://stackoverflow.com/q/35405618/6128276 — Vivek Singh, Feb 25 '17 at 10:01
Duplicate of https://stackoverflow.com/questions/36354325/angular-2-ngfor-using-numbers-instead-collections it seems — A T, Oct 12 '17 at 06:39

AngularChef · Answer 1 · 2017-02-25T16:53:04.007

You could create an array of the right size in the component and iterate on it:

@Component({
  selector: 'app-root',
  template: `
    <ul>
      <li *ngFor="let i of arr">foo</li>
    </ul>
  `
})
export class AppComponent {
  arr = new Array(10);  // let's say 10 is your number
}

FYI, I tried declaring the array directly in the template but it doesn't work:

<ul>
  <li *ngFor="let i of new Array(10)">foo</li>
</ul>

how to loop with out a collection in angular 2

1 Answers1