Как связать JSON в шаблоне с помощью RESTAPI в Angular 7

Question

Привет, я изучаю Angular 7, но застрял в какой-то момент. У меня есть Fake Rest API (GET), и я использую этот API-интерфейс для получения пользовательских данных в моем компоненте и, наконец, связываю эти данные на моей HTML-странице, но, похоже, в HTML нет данных, но я получаю данные в компоненте. У меня есть три файла: 1. Компонент.сервис 2. Component.ts 3. Component.html

Я уже пытался вызвать GetAllAppData в методе ngOnIt, но данные об успехе не получены в компоненте, но не заполнены в HTML

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';

@Injectable({
  providedIn: 'root'
})

export class HomeService {
    url1 = 'http://dummy.restapiexample.com/api/v1/employees';

    constructor(private httpClient: HttpClient){

    }



    public getAll(){

        return this.httpClient.get<any[]>(`${this.url1}`);
    }


}

import { Component } from '@angular/core';
import { Router }  from '@angular/router';  
import { FormsModule } from '@angular/forms';
import {HomeService} from './home.service';


@Component({
  templateUrl:'./home.component.html' ,
  styleUrls: ['./home.component.less'],
  providers : [HomeService]
})
export class HomePageComponent{

    policies:any = [];
    constructor(private homeService:HomeService){

    }

    public GetAllAppData(){
        this.homeService.getAll().subscribe(function(resp){
               if(resp){
                this.policies =resp;
                console.log(this.policies);
                }
        })
    }

    ngAfterViewInit() {
    this.GetAllAppData()
    }
    ngOnInit() {

    }

}

<div class="row col-md-12 col-xs-12">
    <div class="panel">
            <div class="panel-body">
                <table class="table table-striped">
                    <thead>
                        <tr>
                            <th>Name</th>
                            <th>Organisation</th>
                            <th>Total Users</th>
                            <th>Subscribed Users</th>
                        </tr>
                    </thead>
                    <tbody *ngIf="policies.length>0">
                        <tr *ngFor="let comment of policies">
                            <td> 
{{comment.employee_age}}</td>
                            <td>{{comment.employee_age}}</td>
                            <td>{{comment.employee_age}}</td>
                            <td>{{comment.employee_age}}</td>
                        </tr>

                    </tbody>
                </table>
            </div>


    </div>
</div>

Answer 1

что делать, если вы используете функцию стрелки?

function(resp){
           if(resp){
            this.policies =resp;
            console.log(this.policies);
            }
    }

становится

(resp) => {
               if(resp){
                this.policies =resp;
                console.log(this.policies);
                }
        }