在handlebars模板中嵌入JavaScript代码

Question

Handlebars模板内有没有内联脚本的方法？

<script type="text/x-handlebars">
    I'm a row of type "foo"
    <script type="text/javascript">alert('hi');</script>
</script>

当上述模板被渲染时，内联脚本会被移除。

我正在尝试在页面中包含disqus小部件。该小部件基本上是一些标记和disqus脚本。

该小部件应包含在我的应用程序的子视图中。该子视图默认情况下不可见，但根据我的Ember应用程序代码的某些逻辑显示。

- Rajat

Answer 1

您需要在自定义的Ember.View中包装该小部件，以处理实例化并将其添加到DOM中，在包装视图的didInsertElement中完成此操作。Ember期望在DOM操作方面拥有完全的控制权，特别是在handlebars模板中，并且它使用handlebars魔法和Ember.View创建来实现这一点。一旦您定义了自定义视图：

MyApp.DisqusView = Em.View.extend({
    didInsertElement: function() {
        // create widget and append it to this.$()
    }
});

您可以在 Handlebars 模板中使用它：

{{view MyApp.DisqusView}}

出于安全考虑，您的视图不应添加脚本标签，而应直接执行任何JS来插入小部件。

- Christopher Swasey

---

+1，就我所知，Handlebars 的理念是拥有无逻辑的模板。 - louiscoquio

@louiscoquio 我的handlebars模板中没有逻辑。逻辑在JS中，用于何时显示模板。模板只是在自身内部有一个脚本标签。 - Rajat

@Rajat，我犯了一个错误，对此我道歉。 - louiscoquio

Handlebars模板确实需要全面了解内部发生的情况。也就是说，任何在handlebar模板中发生的逻辑或其他事情，如果不是纯标记，则应该发生在{{ helper }}符号内部。 - Christopher Swasey

我会非常感激如果你们中的任何人能够帮助我解决这个相关的问题：https://dev59.com/e2jWa4cB1Zd3GeqPsaLv - Aras