ngFor не работает на элементе <tr>

Question

Итак, я работаю над форумом в своем приложении MEAN-стека и запрашиваю разделы из моего узла node.js.Мне удалось получить то, что я хочу от серверной части, но когда я хочу отобразить 4 раздела, которые я получил, я не могу отобразить строки на моем экране.Я сделал тот же механизм на своих подфорумах, и он, кажется, работает там, но я не вижу, что делает это неработоспособным.

Мой шаблон форума (forum.component.html)

<div class="row justify-content-center mb-3 mt-5">
    <div class="col-md-8">
        <table class="table">
            <thead>
            <tr>
                <th>Forum</th>
                <th>Posts</th>
                <th>Replies</th>
                <th>Last Post</th>
            </tr>
            </thead>
            <tbody>
            <tr *ngFor="let section of sections" [routerLink]="section.name">
                <td>
                    <p><b>{{section.name}}</b></p>
                    <p>For all general topics of Wizards Unite.<br> Ask a question or open a topic te contribute to the community.</p>
                </td>
                <td>{{section.posts.length}}</td>
                <td>{{section.totalReplies}}</td>
                <td>
                    <p>{{section.lastPost.title}}</p>
                    <p>by {{section.lastPost.name}} on {{section.lastPost.date | amDateFormat:'LL'}}</p>
                </td>
            </tr>
            </tbody>
        </table>
    </div>
    <div class="col-md-2 side-column">

    </div>
</div>

мой компонент форума (forum.component.ts)

import {Component, OnInit} from "@angular/core";
import {ForumService} from "./forum.service";
import {ActivatedRoute} from "@angular/router";

@Component({
    selector: 'forum',
    templateUrl: 'forum.component.html',
    styleUrls: [
        'forum.component.css'
    ]
})

export class ForumComponent implements OnInit {

    sections = [];

    constructor(private forumService: ForumService, private route: ActivatedRoute){}

    ngOnInit(){

            this.forumService.getSections()
                .subscribe(function (sections:any) {
                    this.sections = sections.obj;
                    console.log(this.sections);
                })

    }
}

Вот данные, которые я получил от getSections () функция в моем компоненте.На первый взгляд все так, как я хочу, но, как вы можете видеть, строки не появляются в левой части экрана *

Answer 1

Когда вызывается функция обратного вызова, часто меняется контекст this.

В вашем примере this больше не ссылается на класс, поэтому он не устанавливает sections каквы ожидаете.

Измените function (sections:any) на (sections:any) =>.Используя функцию стрелки, она должна сохранить свой контекст