Angular 使用切片管后如何连接管柱

我是新手。我想剪切长度超过15个字符的短字符串，然后在末尾添加

…

例如：

姓名：坦泽尔

职位：实习生

地址：孟加拉

喜欢：C，CPP

我正在使用Priming的

p-chips

来显示一些标签。我没有得到任何错误。事实上我什么也没得到，我的网页只是一片空白。甚至控制台日志也是干净的。这是我的密码：

<p-chips [(ngModel)]="tokens">
  <ng-template let-item pTemplate="item">
    {{item | slice:0:15+'...'}}
  </ng-template>
</p-chips>

而且它工作得很好。你也可以看到这方面的优势。但当我把这个给我的技术主管看时，她说我是个白痴，因为我重新发明了轮子-（她告诉我使用

slice

或Angular自己提供的任何东西。请纠正我的错误。（如果我真的问了一个愚蠢的问题，请原谅）

---

注：我从Angular文档中得到了一些帮助：它不提供在字符串末尾添加省略号的选项。因此，如果您想添加省略号，我认为您的自定义管道是唯一的解决方案。在我们的项目中，我们也使用与您类似的自定义管道

以及您的尝试失败的原因：

{{item | slice:0:15+'...'}}

它不工作，因为您正在传递无效参数

-您可以在这里看到它只接受数字，但您正在传递

15…

（字符串）

一个简单的解决方案（仅使用Angular的

切片

管道）是：

{{ item | slice:0:15 }}...

或：

---

但是这是硬编码的，所以我建议使用您的自定义管道。

这很有效。让我快速运行单元测试用例。请给我2分钟。是的，这个解决方案很完美，您也解释得很好。我将坚持使用

{（项目|切片：0:15）+…}

一段时间。然后让我们看看我的代码审阅者说了什么。祝您好运：）如果技术负责人发现更好的东西，也请告诉我就目前而言，我认为您的方法/解决方案可能是最好的。

ellipsipe

的代码来自（应该在问题中提及，但给出了另一个参考）。您可以告诉您的技术负责人，此解决方案实际上使用的是

SlicePipe

。我要说的是，她的评论并没有给我留下深刻印象……是的，没错。我想我已经粘贴了代码，所以不需要引用。谢谢你纠正我，所以我也添加了相关链接。：-）

{{ item | slice:0:15 }}...

{{ (item | slice:0:15) + '...' }}