如何在Angular中显示两个连续的空间？答案

【问题标题】：How to show two continuous spaces in Angular?如何在Angular中显示两个连续的空间？
【发布时间】：2016-05-16 19:09:25
【问题描述】：

更新：Chris 和 Mark 的两种方式都有效。

我正在使用 Angular 2。我尝试在页面中显示 a 和 b 之间的两个连续空格。我已经尝试了所有这些，但它们都不起作用：

{{text}}

text = "a\00a0\00a0b";
text = `a\00a0\00a0b`;
text = "a&nbsp;&nbsp;b";
text = `a&nbsp;&nbsp;b`;
text = "a  b";
text = `a  b`;

我怎样才能让它工作？

【问题讨论】：

【解决方案1】：

在模板中使用'&#160;' 而不是'&nbsp;'。

【讨论】：

【解决方案2】：

我相信您会因为 html 剥离空格的性质而得到这个。

您也许可以在要呈现该文本的任何元素上使用 white-space: pre css 属性。

function MyCtrl($scope) {
  $scope.text = 'a      b';
}
...
<p style="white-space: pre">{{text}}</p>

我对您的应用了解不多，但也许这就足够了。

【讨论】：

【解决方案3】：

绑定到 DOM 属性 innerHTML 而不是 DOM 属性 textContent（这是 {{}} 绑定到的）：

<span [innerHTML]="text"></span>

text = "a&nbsp;&nbsp;b";

【讨论】：

在 6.0.0 版本中，我发现您必须在文本字符串周围添加单引号，否则它会假定整个内容是一个变量。您也不能从innerHTML 周围获取方括号，因为这会出于不同的原因而抱怨。所以基本上text = "'a&nbsp;&nbsp;b'" 对我有用。