首页 > 解决方案 > 为什么角度将具有不同属性名称的结果集分配给具有不同名称的接口?它是如何工作的?

问题描述

Angular 很奇怪,还是我来自后端背景发现它很奇怪。

看,我有这个角度的界面

export interface apiHero
{
    Id: number,
    Nam: string    
}

然后我给它分配从 webAPI 返回的东西。

在组件中,

HeroesWebAPI: apiHero[]= [];

getHeroes(): void
   {
      console.log("getHeroes called");
      this.heroService.getHeroesFromWebAPI().subscribe( r => {this.HeroesWebAPI= r; 
        console.log("Final hit:"+  this.HeroesWebAPI)});
      
      
   }

服务:

 getHeroesFromWebAPI(): Observable<any>
  {    
    return this.http.get<any>("https://localhost:44320/api/values").pipe(
      map(res => JSON.stringify(res))
    );
  }

现在奇怪的部分,注意界面?它有IdNam属性,而Nam不是返回一个具有属性的类的数组和NamewebAPIIdName

 public class Hero
    {
        public int Id { get; set; }
        public string Name { get; set; }
    }

当我在控制台检查组件功能的结果时,它是

最后一击:[{"Id":1,"Name":"Johns"},{"Id":2,"Name":"Tonny"}]

它是如何映射到具有不同属性的接口的?

标签: angulartypescriptangular-ui-routerobservablewebapi

解决方案


推荐阅读