我在前端使用了angular。net core在后端。我有一个小问题，并与下面的视频图。我花了好几个小时还是没能解决这个问题。
我只是从我的web API获取数据。并使用 *ngFor显示数据。但问题是在点击任何下拉按钮之前数据都不会显示。顺便说一句，下拉按钮没有任何点击事件。这是一个简单的语言选择器。当我点击语言选择器下拉按钮时，它会扩展，同时我的数据会显示在屏幕上。
我得到我的数据ngOnInit。我在调试模式下检查了数据，没有问题。我真的花了很多时间。还是找不到解决办法
我的html代码：

<div class="container">
    <div *ngFor="let d of devices"> --> I put here breakpoint and it run when I click dropdown btn
      <span>{{d.name}}</span>
    </div>
  </div>

我的.ts代码：

import { ChangeDetectorRef, Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';
import { ToastrService } from 'ngx-toastr';
import { Observable } from 'rxjs';
import { Pagination } from '../../../_helpers/Pagination';
import { deviceListModel, NewDeviceModel } from '../../admin-panel.model';
import { AdminPanelService } from '../../admin-panel.service';

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

  devices : Array<deviceListModel>; ---> I also try with public deviceList : deviceListModel[]; nothing change

  constructor(private service : PanelService, private router : Router) { }

  ngOnInit(): void {
    
   this.getDeviceList();
  }

  getDeviceList() {
    this.service.getDeviceList().subscribe(res => {
      this.devices = res;
    })
  } ---> This part works fine. Data comes true from the backend before click the dropdown button.(I checked in debug mode with breakpoints)

}

Visiulize我的问题与下面的链接;https://media.giphy.com/media/jYGHN1Ndxyeqhtn0ZR/giphy.gif
全屏低分辨率：https://giphy.com/gifs/jYGHN1Ndxyeqhtn0ZR/fullscreen

**编辑：**当我尝试只显示其中一个数据，如设备[0]。名称;

<div>
  <span> {{devices[0}.name}} </span>
</div>

我在页面上获得数据，但在控制台中出现错误。
错误来了三次，错误是;4352 ERROR类型错误：无法读取未定义的属性“0”