Question

我正在尝试在我的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>

这是我使用ember模板的页面

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

这是我的applicationresources.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

一起正常工作

Answer 1

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

如果您只需要为某些html提供ember，请使用示例：

Javacript

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>

希望有所帮助

在Grails项目中使用EmberJS并使用布局

1 个答案: