Question

是否可以将Typescript模板/泛型类用作Angular2组件？如果是的话，你能给我/给我一个示例代码吗？

进一步阐述我的问题：我想在我的应用程序中显示多个列表。它们在视觉上/功能上相同但基本上是不同类型的列表，例如IFruits，IVegetables，IGrains等等。所以，我一直在考虑使组件有点像这样：

@Component({
  selector: 'my-list-display',
})
export class MyListDisplayComponent<T> {
  private list: T[];

  // further code to display and perform operations on list... 
}

它甚至有意义吗？有没有替代实现这一目标？请赐教！

Answer 1

如果您想表明属性list是选择的类型之一，我知道有几个选项。您可以创建一个多个类实现的ListItem接口。您还可以创建abstract class ListItem多个类extend / implement。例如

export abstract class ListItem {
  public name: string;
}

export class Fruit implements ListItem {
  public name: string;
}

export class Vegetable extends ListItem {
}


@Component({
  selector: 'my-list-display',
})
export class MyListDisplayComponent {
  private list: ListItem[];

  // further code to display and perform operations on list... 
}

使用界面类似

export interface ListItem {
  name: string;
}

export class Fruit implements ListItem {
  public name: string;
}

@Component({
  selector: 'my-list-display',
})
export class MyListDisplayComponent {
  private list: ListItem[];

  // further code to display and perform operations on list... 
}

如果Fruit类实际上是FruitComponent，则使用情况相同（即FruitComponent implements ListItem）

Typescript泛型类为Angular2组件

1 个答案: