Question

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

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

addcustomersGroup.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

Answer 1

你似乎不明白的是，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"); 
}

你告诉TypeScript编译器：＆＃34;相信我，http.get()返回的observable发出的事件属于CustomerGroupModel[]＆＃34;。编译器无法检查这是否有意义，并且在运行时没有类型检查。就像在前面的例子中一样。

但它没有意义。所有http都在将它收到的json字符串转换为JavaScript对象return JSON.parse(string)。那不会，也永远不会返回CustomerGroupModel[]。拥有CustomerGroupModel实例的唯一方法是致电new CustomerGroupModel()。

所以

使CustomerGroupModel成为一个接口，而不是一个类：它清楚地表明您实际上永远不会拥有作为类CustomerGroupModel的实际实例的对象。只有与CustomerGroupModel接口中定义的属性相同的对象。
修复您的接口定义，使其属性与服务器发送的JSON中的属性实际匹配：id，name，active，customers。不是Id，Name，Active。好处是它还会让您尊重TypeScript / JavaScript命名约定。

在typescript中未定义属性

1 个答案: