Html中的特殊字符全部替换问题

一个字符串中包含了多个“|”，页面显示的时候想把这些“|”都替换成空格。

html如下：

<span>{{record.fourthGradeName}}</span>

假设record.forthGradeName的值为  一|二|三|四

如下，使用replace('|','  ')只能替换一个“|”，但是我想要全部替换。

<span>{{record.fourthGradeName.replace('|','  ')}}</span>

于是，想到了replaceAll，尝试了之后，未果。难道是我写法有问题？

最后，退而求其次，使用了下面的方式：

<span>{{record.fourthGradeName.split('|').join(' ')}}</span>

完美解决！