Menu
I need to assign two variable in for. Something like this in Angular 5+
<div *ngFor="let a of apple, let b of ball">
<a [routerLink]="['/ball',b]">
{{a}}
</a>
</div>
Any suggestions please?
Advance thanks for your help.
393
You can't use multiple *ngFor s in the same element as those are structural directives and angular handles them in a specific way (basically for each structural directive it creates an ng-template element which then holds the directive itself, you can read more about it here: https://angular.io/guide/structural- ...
The * character before ngFor creates a parent template. It's a shortcut to the following syntax: template=“ngFor let item of items” .
app.component.html First, the *ngFor directive is used to iterate over the values of the options array. It's like a forEach loop where a single value is considered, putting it in the value attribute of an option element.
There is no option to break ngFor . You can use a custom pipe that doesn't return values after the element where the condition is met.
It appears that your arrays are the same length, i.e., Parallel Arrays. You should avoid nesting ngFor.
You can use the index of one array, to look into the other:
<div *ngFor="let a of apple; let i = index">
<a [routerLink]="['/ball', ball[i]]">{{a}}</a>
</div>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
