0

我希望我的 javascript 数据是这样的:

"dogs": {
    "ada": {
        age: 7,
        breed: poodle
    },
    "levin": {
        age: 5,
        breed: shitzu
    },
    ...
}

其中名称是对象键。我有这个打字稿类:

export class Dog {
  [dogName: string]: DogDetails;
}

我可以看到我可以封装创建访问器的方法的唯一方法是将这些静态方法添加到Dog

  public static getDogName(dog: Dog): string {
    return Object.keys(dog).toString();
  }

  public static getDogDetails(dog: Dog): DogDetails {
    return dog[Dog.getDogName(dog)];
  }

这太可怕了。一个原因是需要静态访问:

Dog.getDogName(dog)  // this is how it must be done

并且似乎与应该如何编写相反,这将是:

dog.getName();  // this unfortunately can't be done

如果有办法访问索引签名值,情况会好很多。但是我找不到任何方法来实现这一点。有没有办法或者有更好的方法来编写这个类?

请注意,这对于使用索引签名的类是不可能的:

public getName(): string {   // this won't work
    Object.keys(this).toString();
}

既然它抱怨Property 'getName' of type '() => string' is not assignable to string index type 'DogDetails'


@amiramw的回答和评论对话后更新:

使用它的角度分量是:

<ion-list *ngFor="let dog of dogs">
    <ion-item>
      <ion-avatar item-start>
        <img src="assets/img/dog.jpg"/>
      </ion-avatar>
      <h4>{{Dog.getName(dog)}}</h4>
      <p>{{Dog.getDogDetails(dog).breed}}</p>
    </ion-item>
  </ion-list>

在反馈之后,我似乎需要写:

<ion-list *ngFor="let dogName of getDogNames()">
    <ion-item>
      <ion-avatar item-start>
        <img src="assets/img/dog.jpg"/>
      </ion-avatar>
      <h4>{{dogName}}</h4>
      <p>{{getDogDetails(dogName).breed}}</p>
    </ion-item>
  </ion-list>

在哪里getDogNames()

  public getDogNames(): string[] {
    if (this.dogs) {
      return Object.keys(this.dogs);
    } else {
      return new Array<string>();
    }
  }

并且getDogDetails()是:

  public getDogDetails(name: string): DogDetails {
    return this.dogs[name];
  }

哪个有效,但不是我想要的。对于解决我的整体问题的建议,我将给予 @amiramw 赞誉。

但是,如果有办法获得打字稿索引签名值,我将非常感激?

4

1 回答 1

1

您可以为每只狗的数据创建一个接口,并定义一个从字符串到该接口的映射。接口可以被命名(以便重用)或匿名:

enum Breed {
    poodle,
    shitzu
}
let dogs : { [key:string]: {age: number, breed: Breed} } = {
    "ada": {
        age: 7,
        breed: Breed.poodle
    },
    "levin": {
        age: 5,
        breed: Breed.shitzu
    }
};
于 2017-06-11T06:21:58.503 回答