Angular 2 - 使用 <T> 自定义管道以避免在 vscode 中丢失智能感知

Question

在阅读之前：发布的代码没有任何问题，这个问题纯粹与智能感知“问题”有关，或者实际上是一个技术问题。

我正在尝试做什么

基本上，我有一个需要分组的元素数组。为了实现这一目标，我采用了 stackoverflow 中找到的现有 GroupBy 过滤器，将其更改为支持异步源，然后将其放置在我自己的项目中。到目前为止，一切都很好。

然而，因为这样的管道具有一个Array<any>转换值，所以我想知道是否可以使用某种方法<T>来避免在我看来丢失智能感知。

管道源是：

@Pipe({name: 'groupBy'})
class GroupByPipe implements PipeTransform {
  transform(value: Array<any>, field: string): Array<any> {
    // Async support
    // This will prevent pipes stack to throw a null pointer exception.
    if (value != null) {
      const groupedObj = value.reduce((prev, cur)=> {
        if(!prev[cur[field]]) {
          prev[cur[field]] = [cur];
        } else {
          prev[cur[field]].push(cur);
        }
        return prev;
      }, {});
      return Object.keys(groupedObj).map(key => ({ key, value: groupedObj[key] }));
    }
    else {
      return value;
    }
  }
}

因为根据定义，这样的管道应该是一个通用的管道组，所以any当我在我的视图中使用管道时，源实际上迫使我失去智能感知。

基本上，例如：

<div *ngFor="let elem of myModelsArray | groupBy: 'category_id'">
   {{elem.key}}
</div>

假设这myModelsArray是由自定义模型定义的对象数组：

// Just a model.
class MyModel {
  constructor(public id: number, public category_id: number; public name: string){}
}

上面的管道将返回一个Array<any>，因此视图上的智能感知完全丢失。

真正的问题

我想知道是否有一种方法可以<T>在管道中使用泛型：使用它，我应该能够在我的视图中保留智能感知。

基本上，我尝试这样做：

import { Pipe, PipeTransform } from "@angular/core";

@Pipe({name: 'groupBy'})
export class GroupByPipe<T> implements PipeTransform {
  transform(value: Array<T>, field: string): Array<{
    key: any,
    value: Array<T>
  }> | Array<T> {
    // Async support
    if (value != null) {
      const groupedObj = value.reduce((prev, cur)=> {
        if(!prev[cur[field]]) {
          prev[cur[field]] = [cur];
        } else {
          prev[cur[field]].push(cur);
        }
        return prev;
      }, {});
      return Object.keys(groupedObj).map(key => ({ key, value: groupedObj[key] }));
    }
    else {
      return value;
    }
  }
}

当然，它可以编译并工作，但仍然没有解决智能感知问题。问题是（当然）变量失去了智能感知，如此处所示（请注意：模型与上面不同，尽管管道源是）。请注意，我已强制使用“.key”，但智能感知无法解析变量类型。

相反，如果不使用管道，结果如下：

（另外，并不是说它那么相关，而是这是 vscode 的意大利语版本）。

如果有人想玩一下，我制作了一个在线 plunkr，它可以轻松帮助在本地编辑器上重现该问题：

https://plnkr.co/edit/LkCv26PY1UTFXIGIx8wl?p=preview

该模型中已经有模型了。

一个可能的解决方案

当然，扩展强制自定义模型类型的管道或仅通过定义自定义模型的管道定义自定义组是很容易的，但我想知道我是否丢失了某些东西或者我想要做的是只是无意这样做。