将 Ember.js 用于单页网站（不是真正的 Web 应用程序）答案

【问题标题】：Using Ember.js for Single Page Website (not really a web app)将 Ember.js 用于单页网站（不是真正的 Web 应用程序）
【发布时间】：2015-04-10 21:35:57
【问题描述】：

我只是想尝试将 Ember.js 用于我正在做的网站（免责声明：我是一名 Java Web 开发人员，GWT）。

到目前为止，我尝试的是将整个身体标记代码拍成这样

<body>
  <script type="text/x-handlebars"> 
      <!-- The whole page -->
  </script>
</body>

现在，我只想为我的网站利用 Ember.js 的组件、模型和验证等内容。

以下是所涉及的依赖项的简要说明：

   <script  src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
   <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.lazyload/1.9.1/jquery.lazyload.min.js" type="text/javascript"></script>
   <script src="js/vendor/modernizr-2.6.2.min.js"></script>
   <script src="js/jquery-ui.js"></script>
   <script src="js/plugins.js"></script>
   <script src="js/main.js"></script>

   <!-- Ember -->
   <script src="js/libs/handlebars-v3.0.0.js"></script>
   <script src="js/libs/ember-template-compiler-1.10.0.js"></script>
   <script src="js/libs/ember-1.10.0.debug.js"></script>
   <script src="js/app.js"></script>

app.js

App = Ember.Application.create();

App.Router.map(function() {

});

问题是，当我将 body 放入 x-handlebars 脚本时，过去可以工作的 jQuery 插件（如 bxslider、carousel 等）无法与脚本标签内的内容一起工作。

我的方法可能有什么问题？

【问题讨论】：

在view 或component 的didInsertElement 中使用JQuery 插件。您可以尝试Exyht-A Blogging App 了解 Ember 应用程序的基本概念。
我建议你看下面的邪恶鳟鱼...eviltrout.com/2014/06/03/jquery-component.html

标签： javascript ember.js

【解决方案1】：

您的<script type="text/x-handlebars">Script</script> 中呈现的内容是在您的 JQuery 代码运行后呈现的。您可以通过使用 view 或 component 中的 didInsertElement 事件进行修改来解决此问题，以运行初始化渲染视图中的元素所需的任何代码。

didInsertElement: function() {
    this.$().DoStuff();
}

StackOverflow 上还有许多其他问题 - 例如，包括this one - 解决了类似的问题，因此您应该能够调整他们的方法。

【讨论】：