在带有布局的Grails项目中使用EmberJS

Using EmberJS in Grails project with a layout

本文关键字：EmberJS 项目 Grails 布局      更新时间：2023-09-26

我正试图在我的grails项目中使用Ember。然而，我有一个布局问题。成员模板总是显示在页脚下方。当我不使用Ember时，普通html不会发生这种情况。

这是我的布局

<html>
 <head>
   <g:layoutHead/>
   <r:require module="application"/>
 </head>
<body>
  <div id="wrap">
    <g:layoutBody/>
    <div id="push"></div>
  </div>
  <div id="footer>
  </div>
  </r:layoutResources/>
</body>
</html>

这是我使用会员模板的页面

<html>
<head>
  <meta name="layout" content="main"/>
</head>
<body>
  <script type="text/x-handlebars">
     <h1>test</h1>
  </script>
</body>
</html>

这是我的应用程序资源。groovy

modules = {
    application {
        dependsOn "jquery", "emberjs","emberjsdata"
        resource url:'js/application.js'
        resource url:'js/App.js'
    }
    emberjs {
        dependsOn 'jquery,handlebars'
        resource url: 'js/ember-latest-stable.js'
    }
    handlebars {
        resource url: 'js/handlebars-1.0.0-rc.4.js'
    }
    emberjsdata{
        dependsOn 'emberjs'
        resource url: 'js/ember-data-latest.js'
    }
 }

问题

由于某种原因，hello显示在页脚下方。不知道为什么，因为它与普通的html 很好用

默认情况下，成员使用body作为根元素，然后模板的内容将插入并替换到该元素中。所以默认情况下ember是一个单页应用程序。

如果你只需要ember来处理一些html，可以使用示例：

Javascript

YourAppNamespace.rootElement = "#myEmberApp";

Html

<body>
  <div id="wrap">
    <!-- render normally contents from server -->
    <g:layoutBody/>        
  </div>
  <div id="myEmberApp">
    <!-- all content here is controlled by ember -->
  </div>
  <div id="footer>
    My company all rights reserved
  </div>
  </r:layoutResources/>
</body>

希望它能帮助

相关文章：