使用 Angular 时无法获取数据的准确值

Question

我有一个获取请求，我从服务器获取数据，这就是它的样子

 getStreakConfigurations(){
    this.loyaltyPointsService.getStreakConfigurations().subscribe( data => {
      this.streakConfiguration = data
 console.log(this.streakConfiguration,'check')
    }
       )
  }

当我

console.log

我得到

{id: 8, tenantId: null, days: 2, points: 3, tier: 'MID'}

但是当我检查

streakConfid.id

的类型时，它说

undifiend

console.log(typeof this.streakConfiguration.id);

为什么是

undefined

，为什么不是数字？

Answer 1

假设您有一个服务返回此对象数组 (

mockDataArr

) 和单个对象 (

mockDataObj

)：

import { Injectable } from '@angular/core';
import { Observable, of } from 'rxjs';

@Injectable()
export class LoyaltyPointsService {
  constructor() {}

  mockDataArr = [
    { id: 1, tenantId: null, days: 2, points: 3, tier: 'MID' },
    { id: 2, tenantId: null, days: 3, points: 5, tier: 'HIGH' },
  ];

  mockDataObj = { id: 2, tenantId: null, days: 3, points: 5, tier: 'HIGH' };

  getStreakConfigurationsArr(): Observable<any> {
    return of(this.mockDataArr);
  }

  getStreakConfigurationsObj(): Observable<any> {
    return of(this.mockDataObj);
  }
}

然后您在控制器上使用它，如下所示：

  public streakConfigurationArr: any;
  public streakConfigurationObj: any;

  constructor(private loyaltyPointsService: LoyaltyPointsService) {}

  ngOnInit() {
    this.getConfigurationsArr();
    this.getConfigurationsObj();
  }

  getConfigurationsArr() {
    this.loyaltyPointsService.getStreakConfigurationsArr().subscribe((data) => {
      this.streakConfigurationArr = data;
      console.log(this.streakConfigurationArr);
      console.log(
        'in array of objects id is undefined',
        typeof this.streakConfigurationArr.id
      );
    });
  }

  getConfigurationsObj() {
    this.loyaltyPointsService.getStreakConfigurationsObj().subscribe((data) => {
      this.streakConfigurationObj = data;
      console.log(this.streakConfigurationObj);
      console.log('in object id is number', typeof this.streakConfigurationObj.id);
    });
  }
}

这是 stackblitz 示例