Question

Here is live example（对不起，不得不使用url shortener，链接字符break标记） TypeScript版本1.6.2

我的angular2应用程序中有两个服务。我们将它们命名为ServiceA和ServiceB。它们中的每一个都有类似的数据结构，所以我决定使用extends两次不写相同的代码。将提供数据结构的类称为Pages，如下所示：

class Pages {
  public pages = [];
  private active: number = 0;

  get current() {
    return this.pages[this.active];
  }

  constructor(private page, public name: string) { }

  changeActive(page: number): void {
    this.active = page;
  }

  addPage(): void {
    this.pages.push(
      new this.page(this.name + (this.pages.length + 1))
    );
  }
}

pages数组将包含每个服务唯一的类实例。以下是ServiceA的示例：

// ServiceA.pages will be filled with instanced of this class.
// ServiceB.pages will use different class but the constructor 
// will be simmilar(will take only one argument name: string)
class PageA {
  public uniquePropertyA: string = 'Hello World!';
  constructor(public name: string) { }
  // unique methods of PageA
}

服务看起来非常相似。这里预览ServiceA：

class ServiceA extends Pages {
  constructor() {
    super(PageA, 'ServiceA #');
  }
}

// demo
var sA = new ServiceA();
sA.addPage();
sA.current. // Hey there is no auto complete!

此示例工作正常，但我不会在每个页面上获得自动填充，因为其类型为any。我试图用“仿制药”来使它起作用，遗憾的是没有成功，只有here it is。基本上我想知道我传递给Pages类的构造函数，所以我可以得到正确的类型。

我希望你们能帮我解决这个问题。

Answer 1

您无法访问泛型类中的页面属性，因为您正在使用泛型类型T，因此编译器此时没有关于您以后如何使用该类的信息。

如果您需要执行绑定到特定类型的操作，则无法在泛型类中执行此操作。

你可以做的是，在你的班级上使用通用约束。例如其中BasePage是一个接口，例如

interface BasePage {
   name: string;
}

课程将是这样的：

class Pages<T extends BasePage>

您可以在PageA和PageB中实现接口，如下所示：

PageA implements BasePage

然后，您就可以访问泛型类中的name属性。

更新示例：http://goo.gl/Pg85Wx

将类作为参数传递给泛型

1 个答案: