Question

目前，我正在与之交互以请求JSON的系统实际上返回了一个包含大量数据的批处理文件。在我的案例中，试图遵循Angular 2（Heros）教程关于定义类然后定义将返回的每个属性的规范几乎是不可能的。

我正在尝试找到解决方法，因为我不认为这是处理它的正确方法：

export class Example {
  prop1: number,
  prop2: string,
  prop3: {
    prop : string,
    prop : string,
    prop : string,
    prop : string,
    prop : string,
    prop : [{
      prop : string,
      prop : string,
      prop : string,
      prop : string,
      prop : string,
    }];
  },
  prop : string,
  prop : string,
  prop3: {
    prop : string,
    prop : string,
    prop : string,
    prop : string,
    prop : string,
    prop : [{
      prop : string,
      prop : string,
      prop : string,
      prop : string,
      prop : [{
        prop : string,
        prop : string,
        prop : string,
        prop : string,
        prop : string,
    }];,
    }];
  },
}

或者是实际请求JSON数据的最佳方式，然后将其解析为特定的类？或者更好的我甚至都没想过？

Answer 1

您可以使用界面来表示您收到的json。

您可以明确并声明每个属性：

interface Prop3 {
    prop1: string;
    prop2: string;
    prop3: string;
    prop4: string;
    prop5: string;
    prop6: Prop3[];
}

interface Example {
    prop1: number;
    prop2: string;
    prop3: Prop3;
}

您还可以使用indexable interfaces：

interface Example {
    prop1: number;
    prop2: string;
    prop3: { [key: string]: string };
}

可索引方法的问题是编译器无法告诉您是否使用了正确的属性名称。

修改

如果您不明确并使用索引接口，则编译器无法知道哪些键正确，哪些键错误。
例如，假设我从服务器收到一个包含以下字符串的json数据对象：firstName，lastName，username。

如果界面是：

interface Data {
    [key: string]: string;
}

let data: Data; // from server
console.log(data["firstName"]);
console.log(data["firstname"]); // ok but shouldn't be 
console.log(data["dontExists"]); // also ok but shouldn't

另一方面：

interface Data {
    firstName: string;
    lastName: string;
    username: string;
}

let data: Data; // from server
console.log(data.firstName);
console.log(data.firstname); // error: Property 'firstname' does not exist on type 'Data'
console.log(data.dontExists); // error: Property 'dontExists' does not exist on type 'Data'

Angular 2 Classes和大型json文件

1 个答案:

修改