Angular возвращает данные как массив в консоли, но не возвращается в представлении - PullRequest
0 голосов
/ 23 апреля 2020

Я новичок в Angular, у меня есть эта проблема. Я пытаюсь вернуть данные из API. Данные возвращаются успешно и они записываются как массив на консоль, но они не отображаются в представлении, когда я использую директиву ngFor для итерации по ней.

Это служба

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { AccountDetails } from 'src/app/models/account-details.model';

@Injectable({
  providedIn: 'root'
})
export class LoginService {
  formData: AccountDetails;
  private readonly url: string = "http://localhost:60223/api/Account";
  constructor(private http: HttpClient) {

   }

   getLogin()
   {
      return this.http.get(this.url);
   }
}

И мой компонент ts

import { Component, OnInit } from '@angular/core';
import { LoginService } from 'src/services/login.service';
import { AccountDetails } from '../models/account-details.model';

@Component({
  selector: 'app-login',
  templateUrl: './login.component.html',
  styleUrls: ['./login.component.scss']
})
export class LoginComponent implements OnInit {

  formData: AccountDetails;
  list: AccountDetails[];
  constructor(private loginClient: LoginService) {

   }

  ngOnInit() {
    this.loginClient.getLogin()
    .subscribe(resp => {this.list = resp[enter image description here][1] as AccountDetails[]
      console.log(this.list)
  });
  }

Вид компонента

<div class="container">
    <ul *ngFor="let ls of list">
        <li>{{ls.Username}}</li>
    </ul>
</div>

Изображение - это то, что я получаю в консоли. https://i.stack.imgur.com/RFA0T.png

Пожалуйста, помогите.

...