Aurelia 中的 ES6 字符串插值答案

【问题标题】：ES6 String Interpolation in AureliaAurelia 中的 ES6 字符串插值
【发布时间】：2015-04-05 15:47:17
【问题描述】：

我正在尝试遵循 aurelia.io 上的“入门”部分，并且在字符串内的字符串插值方面遇到了一些问题。

在第一个示例的视图模型中，“fullName”计算的 getter 返回一个字符串

return '${this.firstName} ${this.lastName}'

此值在视图（html 模板）中用作 ${fullName}。

问题不是显示计算的全名，而是显示实际的返回字符串。我已尝试使用 Chrome 和 Firefox，但两者都没有显示正确的值。

welcome() 函数也存在同样的问题，因为它也返回一个字符串值。

我注意到在 Aurelia Visual Studio 示例中，返回值已更改为实际计算的字符串。

return this.firstName + " " + this.lastName;

我做错了什么？

【问题讨论】：

【解决方案1】：

你的答案是正确的。这实际上是 ECMAScript 6 的一个特性，而不是专门针对 Aurelia。在 ES6 中，分隔模板字符串的是 ` 字符，而不是 ' 字符。

关于 Visual Studio 示例，这只是输出相同结果的另一种方式。然而，这种风格在 ECMAScript 5/JavaScript 中是有效的。您还可以编写以下内容，因为它们都是等价的：

return [this.firstName, this.lastName].join(' ');

【讨论】：

感谢您的澄清。刚开始学习 ES6 就犯了错误。在 Visual Studio 上，Typescript 1.4 版现在支持字符串插值，因此可以直接使用相同的格式。
确实如此，但是我在让它工作时遇到了一些麻烦，仅供参考。另外，如果这个答案有帮助，请点赞并采纳。 :)
Typescript 的问题是随机的吗？
不，我从来没有让字符串模板在 ttypescript 中工作

【解决方案2】：

我的新手错误。对于字符串插值字符串，我使用了单引号而不是反划线。

所以正确的方法是

return `${this.firstName} ${this.lastName}`

对此感到抱歉。

【讨论】：