Repeat HTML element multiple times using ngFor based on a number
You could use the following:
@Component({
(...)
template: `
<div *ngFor="let i of Arr(num).fill(1)"></div>
`
})
export class SomeComponent {
Arr = Array; //Array type captured in a variable
num:number = 20;
}
Or implement a custom pipe:
import {PipeTransform, Pipe} from '@angular/core';
@Pipe({
name: 'fill'
})
export class FillPipe implements PipeTransform {
transform(value) {
return (new Array(value)).fill(1);
}
}
@Component({
(...)
template: `
<div *ngFor="let i of num | fill"></div>
`,
pipes: [ FillPipe ]
})
export class SomeComponent {
arr:Array;
num:number = 20;
}
<ng-container *ngFor="let _ of [].constructor(20)">ð±</ng-container>
generates ð±ð±ð±ð±ð±ð±ð±ð±ð±ð±ð±ð±ð±ð±ð±ð±ð±ð±ð±ð±