我正在使用Ember，我的视图呈现在我的HTML DOM的底部，而不是在div元素中。这里是我的源代码：Ember视图呈现在DOM的底部

的index.html：

<body> 
    <div id="test"> 
    <script type="text/x-handlebars"> 
     {{view Skills.RecommendedSkillsListView}} 
    </script> 
    </div> 

    <script type="text/x-handlebars" data-template-name="recommended_skills_list"> 
    <a href="#" {{action "b"}}>DO A NEW THING</a> 
    </script> 

    <script src="js/libs/jquery-1.8.3.min.js"></script> 
    <script src="js/libs/handlebars-1.0.rc.1.js"></script> 
    <script src="js/libs/ember-1.0.0-pre.2.js"></script> 
    <script src="js/app.js"></script> 
</body>

app.js：

Skills = Ember.Application.create({}); 
Skills.RecommendedSkillsListView = Ember.View.extend({ 
    templateName: 'recommended_skills_list', 
    b: function(v) { 
     alert('new hello'); 
    }  
}); 
Skills.initialize();

渲染的文件：

<body class="ember-application"> 
    <div id="test"></div> 

    <script src="js/libs/jquery-1.8.3.min.js"></script> 
    <script src="js/libs/handlebars-1.0.rc.1.js"></script> 
    <script src="js/libs/ember-1.0.0-pre.2.js"></script> 
    <script src="js/app.js"></script> 

    <div id="ember135" class="ember-view"> 
    <div id="ember140" class="ember-view"> 
     <a href="#" data-ember-action="1">DO A NEW THING</a> 
    </div> 
    </div> 
</body>

注意：当使用与以前版本的烬（0.9.5）相同的代码时，它如预期的那样工作

来源

2013-01-11 alxscms

啊，它看起来像'附加你的观点'给你的身体， 'Ember寻找的模板名称。为什么不尝试在body中放置一个div，然后在Ember.Application.create（）中引用它;？

Ember.Router

Skills = Ember.Application.create({ 
    rootElement: '#test' 
});

查看

<body> 
    <div id="test"></div> 

    <script src="js/libs/jquery-1.8.3.min.js"></script> 
    <script src="js/libs/handlebars-1.0.rc.1.js"></script> 
    <script src="js/libs/ember-1.0.0-pre.2.js"></script> 
    <script src="js/app.js"></script> 

    <div id="ember135" class="ember-view"> 
    <div id="ember140" class="ember-view"> 
     <a href="#" data-ember-action="1">DO A NEW THING</a> 
    </div> 
    </div> 
</body>

让我知道如果我错过了点;）

来源

2013-01-11 18:22:19

谢谢您的回答，但其实这并没有解决真正的问题：/看我要评论以前的答案！ – alxscms

请帮我解释downvote（谁downvoted）谢谢:) –

你需要指定的元素将您的应用程序使用rootElement（docs here，相关问题：Emberjs rootElement）您的应用程序的属性：

Skills = Ember.Application.create({ 
    rootElement: "#test" 
});

这里是一个工作示例：jsfiddle example

从例如渲染输出：

<body> 
    <div id="test" class="ember-application"> 
    <div id="ember135" class="ember-view"> 
     <div id="ember140" class="ember-view"> 
     <a href="#" data-ember-action="1">DO A NEW THING</a> 
     </div> 
    </div> 
    </div> 
</body>

来源

2013-01-11 19:15:48 CraigTeegarden

这个解决方案实际上在我的例子中工作，但如果我有两个div元素（#test和＃test2），我想有一个特定的视图呈现在每个div元素中？你的解决方案只允许我改变根目录，但并不能真正解决我的问题。有什么想法？（我的代码在这里和ember-1.0.pre.min.js完美搭配）感谢您的时间！ – alxscms

@alxscms您应该将所有的ember模板都渲染到您的应用程序的单个'rootElement'下，但是您可以使用ember功能来完全灵活地将哪些元素渲染到您的'rootElement'内。这是一个并排渲染3个视图的示例（http://jsfiddle.net/arasbm/fLBty/3/）。它稍微过时了，所以您将不得不查看当前的指南，了解如何在当前版本的ember中执行此操作（http://emberjs.com/guides/）。 – CraigTeegarden

我也解决了它使用这个答案，但仍然不知道为什么它不工作。 – icemelt7