Angular 如何创建按子字符串过滤字符串并将其删除的角度管道

我想创建一个角度管道，它按子字符串过滤字符串，如果出现子字符串，它将返回一个新的过滤字符串

对我来说，这里的困难在于过滤器必须处理两个单独的项目

以下是我的模板的相关部分：

<span class="type">{{ item.type | filterTypeNames }}</span>
<span class="name">{{ item.name | filterTypeNames }}</span>

以下是管道应如何工作的示例：

<span class="type">{{ item.type | filterTypeNames }}</span>
<span class="name">{{ item.name | filterTypeNames }}</span>

如果类型为“TEST”且名称为“TEST-A1”，则管道应返回“TEST-A1”。因此子字符串“TEST”不应再次显示

所以：

<span class="type">{{ item.type | filterTypeNames }}</span>
<span class="name">{{ item.name | filterTypeNames }}</span>

测试
测试-A1

应该变成：

<span class="type">{{ item.type | filterTypeNames }}</span>
<span class="name">{{ item.name | filterTypeNames }}</span>

测试-A1

..且仅显示在具有“类型”类的范围内。类为“name”的范围应为空

如果名称和类型不同，则不应更改任何内容。例如：

<span class="type">{{ item.type | filterTypeNames }}</span>
<span class="name">{{ item.name | filterTypeNames }}</span>

测试
布拉布拉-A1

…应该保持不变

---

我目前不知道如何组合或比较这些值​​如果有任何帮助，我将不胜感激。

我认为您最好调整组件中的数据，而不是管道中的数据，但您也可以提供具有以下附加参数的管道：

item.type | filterTypeNames:item.name

您实际上想要创建的是自定义结构指令，而不是简单的管道，我正在试着为你做一个演示stackblitz@MikeS. 有意思。。现在，我得到了在管道中过滤所需的值。我现在尝试使用indexOf来检查类型是否作为子字符串出现在名称中。但是我怎样才能返回结果呢。。。非常令人困惑……我的技术负责人告诉我为此创建一个可重用管道，但作为替代方案的指令会很好。非常感谢。管道是非常简单的存在物，从

transform

方法返回的任何内容都将显示在模板中，而不是表达式中。例如，

item.type | filterTypeNames

转换为从

transform

方法返回的内容