具有父/子關系的 angular 組件中的泛型類型定義

Question

我正在嘗試創建這樣的組件：

<dropdown formControlName="car">
  <dropdown-option value="volvo"></dropdown-option>
  <dropdown-option value="bmw"></dropdown-option>
  <dropdown-option value="peugeot"></dropdown-option>
  <!-- etc -->
</dropdown>

我對下拉組件的定義如下：

export component DropdownComponent<T> {
  possibilities: Array<T>
}

我對下拉選項組件的定義如下：

export component DropdownOptionComponent<T> {
  @Input() value: T
}

我的DropdownOptionComponent是否有可能推斷出DropdownOptionComponent的泛型類型T並將DropdownComponent的可用選項限制為滿足泛型T的任何選項？

編輯：為了進一步澄清我想要解決的問題，我希望我的模板足夠聰明，可以看到給定父定義，在我的模板中，它將檢查它是否有效。

編輯2：更好的例子：

// mycomponent.component.ts
export class MyComponent {
  data: Array<{param1: number, param2: string}>;
}

<!-- mycomponent.component.html -->
<table [dataSource]="data">
  <table-entry *myTemplateDirective="let entry">
    <!-- do something with entry -->
  </table-entry>
</table>

是否可以根據表格組件中的data輸入來entry類型的條目。

編輯 3：代碼示例中的錯字

Answer 1

即使在將值從父組件傳遞到子組件時聲明子組件具有泛型類型，默認情況下也會獲得父組件本身使用的確切類型。 你不需要再明確地做。

如果您查看下面的示例，則在您使用 boolean 值聲明屬性值的那一刻。 Typescript 將能夠判斷該屬性與什么類型相關聯，以類似的方式它也適用於您的用例