Tags down


NgFor not being passed an array

By : david beukes
Date : July 29 2020, 04:00 PM
I hope this helps . I bet this.links resolves into an object and not an array.
Do this in your ngOnInit:
code :
    this.links = this.menusService.getLinks();
    this.links.subscribe(data => console.log(data)); // ensure data here is an array and not an object with `{ body: [....] }`
      return this.http.get('api address').pipe(
        map(res => res.body),

Share : facebook icon twitter icon

Why when I'm using `*ngIf` and `*ngFor` on same element, `*ngFor` add null item to array which I'm iterating?

By : user5297419
Date : March 29 2020, 07:55 AM
I wish this help you try using this if you are using below beta 8, because angular2 does't support *ngIf anf *ngFor on same element beta 8(see here ) and below -
code :
<template [ngIf]='hotel.rooms.length > 0'>
 <div *ngFor='#room of hotel.rooms; #i=index'>
 ... Your code

angular2 *ngFor setting style on ul>li with a color value passed

By : Nguyễn Bá Vinh
Date : March 29 2020, 07:55 AM
I hope this helps you . use [ngStyle] directive for more detail check this link
code :
import {Component} from '@angular/core';
import {NgStyle} from '@angular/common';
 selector: 'ngStyle-example',
 template: `
   <h1 [ngStyle]="{'font-style': style, 'font-size': size, 'font-weight': weight}">
     Change style of this text!
   <label>Italic: <input type="checkbox" (change)="changeStyle($event)"></label>
   <label>Bold: <input type="checkbox" (change)="changeWeight($event)"></label>
   <label>Size: <input type="text" [value]="size" (change)="size = $event.target.value"></label>
 directives: [NgStyle]
export class NgStyleExample {
   style = 'normal';
   weight = 'normal';
   size = '20px';
   changeStyle($event: any) {
     this.style = $event.target.checked ? 'italic' : 'normal';
   changeWeight($event: any) {
     this.weight = $event.target.checked ? 'bold' : 'normal';

Angular 2 - ngFor-Iteration --> click-event doesn´t works on single Array-Entry of ngFor

By : Call_Me_Oji
Date : March 29 2020, 07:55 AM
I hope this helps . if you want for Implement a click-event for toggle an active-state for EACH of this
  • -tag you need to modify you array setting a property active to every item for example:
    code :
    questions = {
     quest_1: {
       quest: 'my question...',
       answers: [
         {text: 'answer A', active: false},
         {text: 'answer B', active: false},
         {text: 'answer C', active: false},
         {text: 'answer D', active: false}
      <li *ngFor="let answer of questions.quest_1.answers, let i=index;" (click)="answer.active = !answer.active" [ngClass]="{'active': answer.active}">{{answer.text}}</li>

  • Angular access ngFor index on another ngFor inside array

    By : Sasikumar Sadayan
    Date : March 29 2020, 07:55 AM
    around this issue I have the following object: , Try to use [] notation to access property
    code :
    <div *ngFor="let new of news; let newindex = index;">
      <div *ngFor="let item of itemList[newindex]">

    ngFor take last created Array by parent ngFOR

    By : dhananjay
    Date : March 29 2020, 07:55 AM
    should help you out you can directly use tab.content, no need of this.tab. Everytime you run the getTabContent function, it will replace this.tab values, so it will always hold the last ran value.
    code :
    <mat-tab *ngFor="let tab of asyncTabs ">
        <ng-template mat-tab-label>{{tab.label}}</ng-template>
        <div *ngFor="let event of tab.content">
            <event-thumbnail [eve]="event"></event-thumbnail>
       return this.events.filter(x=> x.price === condition);
    Privacy Policy - Terms - Contact Us © voile276.org