2017-05-26 83 views
2

嗨除去二两绑定值之间的空白我有类似下面的角2模板代码:如何角2/4

  <td> 
       <a href="#"> 
        {{row.test[0].size}} 
        {{row.test[0].length}} 
        {{row.test[0].width}} 
       </a> 
      </td> 

但是,当在浏览器中加载的项目我得到这些值之间的空间。我不想要。我该如何解决这个问题?任何想法的家伙?我需要使用任何管道或其他东西吗?提前致谢。

+1

回车将在HTML中创建一个隐藏空间;如果你希望它们全部串在一起而没有空格,那么它们都需要在标记中位于同一行。 – Claies

回答

0

这将是很好,如果你可以在模板直接插补,但因为你不能,那么像这样创建您的成分的“吸”:

get combined() { 
    return `${this.row.test[0].size}${this.row.test[0].length}${this.row.test[0].width}`; 
} 

且模板中像这样使用:

{{ combined }} 

或者一个更 “动态” 的做法作为一种方法:

getCombined(currRow) { 
return `${currRow.test[0].size}${currRow.test[0].length}${currRow.test[0].width}`; 
} 

而在模板中使用,通过在当前值:

{{ getCombined(row) }} 

然后,它表现为只有一个字符串。

另请参阅:https://github.com/angular/angular/issues/7558这是与在模板中解析不相关的问题。

而且在这个question,关于这个问题的另一个例子。

+0

这给了我模板解析错误Neil。 – blackdaemon

+0

'错误:未被捕获(承诺):错误:模板解析错误:↵Parser错误:意外的标记Lexer错误:表达式['中的第2列中的意外字符[']行 – blackdaemon

+0

@blackdaemon右你是。这很烦人,ES6模板不会直接解析。修改了答案并实际测试了在组件上使用“getter”。有趣的是,我在发布原始答案后就走开了,但开始认为它至少会更“清洁”地展示吸气剂。事实证明,这是真正的**唯一**的方式来做到这一点。 –