在Handlebars.js的helper参数中，将字符串和变量连接起来的正常方式是什么？

Question

我正在尝试在Ember中构建一个简单的模态组件，但是Handlebars的"无逻辑"对我来说似乎太不合理了。有没有一种理智的方法可以实现类似这样的结果？

<h2>Nice block about {{title}}</h2>
<a href="#" data-toggle="modal" id="add-item-{{title}}"> {{!this works}}

{{#my-modal modal-id="add-item-{{title}}" header='New {{title}}'}} {{! those don't}}
  <p>My body blabla</p>
{{/my-modal}}

目前，我最终得到的模态框 id 是 "add-item-{{title}}"，字面上也是这样，以及模态框的标题。

而且...不，目前我不考虑将 "title" 作为一个新的参数传递，并在模态框中使用它。另一个模板中的模态框标题可能不是 "New {{title}}"，而是 "你确定吗？" 或者 "关于 {{title}} 的详细信息"。

- igorsantos07

---

这就是你应该做的，或者在控制器或组件中创建一个计算属性，在作用域内连接和构建字符串。 - Kingpin2k

最后一件事，{{}}中的{{}}不受支持。 - Kingpin2k

显然它们不受支持！这正是我的问题 :( 如何在Handlebars参数中插值变量？ - igorsantos07

关于“无逻辑”的问题，我想知道“minimal templating on steroids”标语中的“on steroids”是什么意思，但也许这与在服用类固醇时失去逻辑有关...没有优雅的内置方式来连接字符串或使用“if else”对我来说是不可理解的。 - konrad

Answer 1

您需要的是concat帮助程序。使用它，您的第二个示例将变为：

{{#my-modal modal-id=(concat 'add-item-' title) header=(concat 'New ' title)}} 
  <p>My body blabla</p>
{{/my-modal}}

- Mike Post

---

哇！这非常有用。我不知道它的存在。谢谢！ - Sarus

谢谢，这帮助我正确设置了背景URL... https://gist.github.com/Artistan/8ee82f6753dca632ca3307917b4e6034 - Artistan

Answer 2

我在寻找handlebars.js中的concat帮助程序，并发现有一个内置的append帮助程序，对于也在寻找相同内容的人来说可能会有用。

{{> my-modal modal-id=(append "add-item-" title) header=(append "New " title)}}

https://github.com/helpers/handlebars-helpers

- jiminy

Answer 3

是的，我是通过传递标题来实现的。如果您需要在标题中添加的内容不仅仅是model.title，那么可以在您的控制器上添加一个计算属性（使用es6字符串插值语法）：

控制器

  modalHeader: function() {
    return `New ${this.get('model.title')}`;
  }.property('model.title')

模板

{{#my-modal header=modalHeader}}
  <p>My body blabla</p>
{{/my-modal}}

关于id，您可以在组件中做一些有趣的事情来覆盖它，请参见this codepen，但我不知道它会如何干扰Ember。无论如何，您为什么要为模态框设置id？

- Kori John Roys

---

关于ID：在示例中，我已将其重命名。这个想法是将模态框的内部ID设置为我们可以清晰地在外部引用的内容，以便我可以通过jQuery或Bootstrap自己的行为打开/关闭模态框。 - igorsantos07

关于模态标题的问题是：不同的模态将拥有完全不同的标题。如果我必须在模态本身设置一个计算属性，那么它将无法工作：完整的标题必须来自外部。 - igorsantos07

是的，这就是为什么modalHeader计算属性在控制器上的原因。 - Kori John Roys

你没有理解。在模态框的任何部分内设置模态框标题都是没有意义的。它应该由包含的模板设置，这样它就像一个组件而不是硬编码的东西。 - igorsantos07