Angular typescript中未定义的属性

我在typescript中有一个问题，它是一个对象的属性，当我在控制台中登录它时，它仍然给我未定义的属性。这是我的班级：

export class CustomerGroupModel {
    public Id: number;
    public Name: string; 
    public Active: boolean;
}

在

addCustomerGroup.component.ts

中：

   public customersGroups : CustomerGroupModel[] = [];

   let customerGroup = this.customersGroups[form.value.customer_group];

   console.log(customerGroup);
   console.log(customerGroup.Name);

输出是

{id: 2, name: "Group2", active: false, customers: Array(0)}
undefined

---

您似乎不明白的是，TypeScript纯粹是一个编译器。运行时没有类型检查。例如，这在TypeScript中运行得非常好：

const foo: number = 1;
const bar: any = foo;
const baz: string = bar;

请参阅：最后得到一个变量

baz

，类型为

string

，它实际上引用了一个数字。因为在运行时，它会变成普通的旧JavaScript：

var foo = 1;
var bar = foo;
var baz = bar;

所以，当你写作的时候

public getCustomerGroups() { 
  return this.http.get<CustomerGroupModel[]>(this.baseUrl + "api/CustomerGroup/getallgroup"); 
}

public getCustomerGroup（）{
返回this.http.get（this.baseUrl+“api/CustomerGroup/getallgroup”）；
}

您告诉TypeScript编译器：“相信我，

http.get（）

返回的observable发出的事件属于

CustomerGroupModel[]

”类型。编译器无法检查这是否有意义，并且在运行时没有类型检查。就像前面的例子一样

但这毫无意义。http将接收到的json字符串转换为JavaScript对象所做的一切是

返回json.parse（string）

。这不会，也永远不会返回

CustomerGroupModel[]

。拥有

CustomerGroupModel

实例的唯一方法是调用

new CustomerGroupModel（）

所以

使

CustomerGroupModel

成为一个接口，而不是一个类：它清楚地表明，您实际上永远不会拥有作为类的实际实例的对象

CustomerGroupModel

。仅具有与

CustomerGroupModel

界面中定义的属性相同的属性的对象

修复接口定义，使其属性与服务器发送的JSON中的属性真正匹配：

id

，

name

，

活动的

，

客户

。非

Id

，

Name

，

活动

。好的方面是，它还将使您尊重TypeScript/JavaScript命名约定

---

好的，这仅仅意味着您所记录的实际上不是CustomerGroupModel的实例。还要注意属性的区别：Active vs.Active，id vs.id。数组中的数据来自哪里？它来自类型为CustomerGroupModelPost的服务。public getCustomerGroups（）{返回this.http.get（this.baseUrl+“api/CustomerGroup/getallgroup”）；}this.customersService.getCustomerGroups（）.subscribe（数据=>{this.customersGroups=data；}，错误=>{console.log（错误）；}）；如果后端返回大写的属性，我该怎么办？我必须在每次通话中重新映射它们吗？或者有什么简单的形式可以转换它们吗？接口应该正确地描述您从后端实际接收到的内容。如果您选择在后端不遵循JS命名约定，那么在前端也要这样做。或者两者兼而有之。