ngfor Questions

10

Solved

I have a collection of items, where each item have a rank attribute, which is a number. I wan to loop over this number, here is what I've tried: <div class="col-md-3 col-sm-4 item-container" *n...
Osmious asked 18/10, 2017 at 7:57

3

Here is the code that is throwing error: user-list.component.html: <ul> <li *ngFor="let name of names">Hello {{ name }}</li> </ul> Error: NG0303: Can't bind to ...
Cassondracassoulet asked 25/1 at 15:12

11

Solved

I have a simple ngFor loop which also keeps track of the current index. I want to store that index value in an attribute so I can print it. But I can't figure out how this works. I basically have ...
Incurvate asked 15/2, 2016 at 9:27

19

Solved

I'm having a problem with trying to use Angular's *ngFor and *ngIf on the same element. When trying to loop through the collection in the *ngFor, the collection is seen as null and consequently f...
Toting asked 7/1, 2016 at 14:37

3

Solved

I have an array of objects. i am iterating that in loop and passing each item's name to onclick which targets a function openIt(val) in app.js file which is in assets folder. ie Angular Code: &lt...
Lutenist asked 8/1, 2020 at 6:22

5

I am creating a FAQ page with accordion buttons, with groups of buttons under sub-headers. I designed it using an ngFor statement in the faq.html file. <h1>Frequently Asked Questions</h1&g...
Lair asked 16/12, 2021 at 23:16

8

Solved

I can't really understand what I should return from trackBy. Based on some examples I've seen on the web, I should return the value of some property on the object. Is it right? Why should I get ind...
Triadelphous asked 8/2, 2017 at 8:35

3

Solved

Let's say we have an array of items: items = [ { title: 'item 1'}, { title: 'item 2'}, /* ... */ ]; And there is a template that renders this array: <ul> <li *ngFor="let item of it...
Duty asked 15/2, 2017 at 8:56

5

Solved

I am trying to iterate over the properties of an object using *ngFor but using in. When I try to do this @Controller({ selector: 'sample-controller', template: ` <ul> <li *ngFor="let...
Confab asked 17/7, 2017 at 18:36

4

Solved

I want to display a dataList. Some values are calculate from a function. It seems angular2 calls the calculate function many times. <tr *ngFor="let data of dataList"> <td>{{ data.no...
Supplicant asked 20/7, 2017 at 6:54

4

I am new to angular and started working on version 12 and I am stuck in a point. Where I want to iterate in my union array in the template but it gives me error. Error: Type 'IBasketItem[] | IOrder...
Meatball asked 17/8, 2021 at 18:1

2

How can I transclude/project into a slot that is within a loop, and have the projected content able to access the loop variables? Say I have a base component with the following <tr *ngFor="let...
Pastoralize asked 13/2, 2017 at 22:22

2

Solved

I am trying to iterate this object { "2021-11-22": [ { "id": 1, "standard_id": 2, "user_id": 4, "subject_id": 1, "exam_date": &quo...
Zero asked 23/11, 2021 at 8:13

5

Solved

I neet to display in table sort data js let array = [ { idx: number, name: string, btn: number, index: number }, { idx: number, name: string, btn: number, index: number }, { idx: number, name: s...
Undershirt asked 14/5, 2019 at 8:16

4

Solved

I think my problem is that the API delivers an Object instead of an array. So I need to modify the Object to be an Array? How could this be done? Object.assign? Or Pipe? Does anyone have a proper e...
Venomous asked 17/7, 2018 at 19:59

5

Solved

Hi I have unordered list and all of them have active class. I want to toggle active class when clicked to any list item. My code is like this <ul class="sub_modules"> <li *ngFor="let sub...
Tamekia asked 31/5, 2017 at 14:3

8

Solved

I am trying to find out how to create a variable in an ngFor loop. I have a loop like this: <td *ngFor="#prod of products"> <a href="{{getBuild(branch,prod)?.url}}"&gt...
Shiftless asked 7/2, 2016 at 18:38

3

Solved

When i use *ngFor in angular with a function returning my data, the function is called multiple times, and sometimes resulting even in a loop: app.component.ts export class AppComponent { ge...
Barm asked 18/4, 2019 at 3:36

5

Solved

tried every syntax i can guess couldnt make it works ! <!--- THIS WORKS FINE ---> <ion-card *ngFor="#post of posts"> {{post|json}} </ion-card> <!--- BLANK PAGE ---> <io...
Platinous asked 31/3, 2016 at 1:57

4

Solved

In Angular, is the trackBy function necessary for *ngFor? I saw a few articles here, here, here, and here that say using trackBy will improve performance and has better memory management. But I was...
Fleurdelis asked 17/4, 2018 at 15:5

2

Solved

I made the following structure in my json file with Firebase Real Time Database to work on Composer and his Compositions: I have the following service that give me the data of one composer with ...
Potts asked 23/1, 2018 at 13:39

17

Solved

What am I doing wrong? import {bootstrap, Component} from 'angular2/angular2' @Component({ selector: 'conf-talks', template: `<div *ngFor="talk of talks"> {{talk.title}} by {{talk.speake...
Tidewater asked 1/12, 2015 at 3:52

3

Solved

I'm making a dynamic form. A Field has a list of values. Each value is represented by a string. export class Field{ name: string; values: string[] = []; fieldType: string; constructor(fieldTyp...
Saltworks asked 19/2, 2017 at 2:24

4

Solved

I am using ngFor to loop 8 json objects and I want not only to loop the values but also I want to count the number of looping values and display the number. For example, if json value is Content...
Excellence asked 17/4, 2017 at 1:29

4

Solved

I need to make an item draggable with angular-cdk. I have imported the DragDropModule in the app module. I am applying the cdkDrag inside an ngFor. <div *ngIf="messages.length" > <div *...
Dingo asked 3/6, 2019 at 12:29

© 2022 - 2024 — McMap. All rights reserved.