如何在Angular HTML中提取JSON对象的首个单词？

方法一：模板内直接处理 #

可以在插值表达式中通过split()方法按逗号分割字符串，再取数组的第一个元素，同时加上安全导航操作符?.避免空值报错：

<td>{{ issue.otherInformation?.split(',')[0] }}</td>

如果otherInformation为空或没有逗号，这个写法会直接返回原字符串（空则返回空），符合需求。

方法二：组件内封装方法（推荐，更易维护） #

在组件类中定义一个提取第一个单词的方法：

getFirstSegment(info: string): string {
  return info?.split(',')[0] || '';
}

然后在模板中调用这个方法：

<td>{{ getFirstSegment(issue.otherInformation) }}</td>

这种方式更适合需要重复使用该逻辑的场景，也方便后续修改分割规则。

内容的提问来源于stack exchange，提问作者Nadula