在Angular 2的ngFor中获取类型的第一行答案

【问题标题】：Getting first row of a type in ngFor of Angular 2在Angular 2的ngFor中获取类型的第一行
【发布时间】：2017-03-25 16:44:11
【问题描述】：

所以，我有（Angular 2）之类的数据

[
{text: "first", name: "a"},
{text: "rw", name: "a"},
{text: "ds", name: "b"},
{text: "asdf", name: "b"},
{text: "ASDF", name: "b"},
{text: "ertre", name: "b"}
{text: "hf", name: "c"}
]

我必须使用该数据来显示内容列表，但方式类似于

<div>a</div>
<p>a's text 1</p>
<p>a's text 2</p>
<p>a's text 3</p>
<div>b</div>
<p>b's text 1</p>
<p>b's text 2</p>
<p>b's text 3</p>

如果不创建自定义过滤器，这可能吗？意思很简单，如果在 ng 中重复 *ngFor。

基本上我会做ngIf 来显示标题div 如果它第一次出现该值（我们可以检查a==a 然后隐藏标题，b==a 然后显示标题）。

【问题讨论】：

一些关于创建管道的信息，包括自定义管道：angular.io/docs/ts/latest/guide/pipes.html#
您需要对数据进行预处理。你不能在模板中做这种逻辑。
@R.Richards 这实际上是可行的，但在不使用管道的情况下询问。 torazaburo 这是可行的，只是想避免这一步
@Luckyy 对不起，当我看到自定义过滤器时，我假设是管道。祝你好运！

标签： angular ngfor

【解决方案1】：

您可以使用<ng-container>。看看如何Group sibling elements with <ng-container>。

<ng-container *ngIf="a!=='a'">
 <div>a</div>
 <p>a's text 1</p>
 <p>a's text 2</p>
 <p>a's text 3</p>
</ng-container>

【讨论】：