3

I am building an ember.js/rails application. All the handlebar templates are stored in .js files. I'd like to understand how they get inserted into the DOM when the router changes state. Which part of ember does this? How do I tell ember to place templates?

Right now I can only get my templates appended to the <body> I have a jsFiddle here.

I am aware of setting rootElement on Ember.Application, however I want the app to control other elements of the page.

Handlebars / HTML:

<script type="text/x-handlebars" data-template-name="application">
    <h2>I'm the content</h2>
    <p>This should be inbetween the header &amp; footer</p>
    <p><strong>time</strong> {{time}}</p>
</script>

<header>
    <h1>Application</h1>
</header>
<article>
    <div id="content"></div>
</article>
<footer>
    <a href="http://blog.deanbrundage.com" target="_blank">by Dean</a>
</footer>

​JavaScript:

window.App = Ember.Application.create();

App.Router = Em.Router.extend({
    initialState: 'root.home',
    root: Em.Route.extend({
        home: Em.Route.extend({
            view: App.ApplicationView
        })
    })
});

App.ApplicationController = Em.Controller.extend({
    time: Date()
});
App.ApplicationView = Em.View.extend({
    templateName: 'application'
});

App.initialize();
4

2 回答 2

5

Ember.js 中的当前实现将 附加ApplicationView到rootElement应用程序的 ，请参见此处。

一种可能的解决方案是覆盖appendTo您的ApplicationView，请参阅http://jsfiddle.net/pangratz666/m8L6Z/：

JavaScript：

App.ApplicationView = Em.View.extend({
    templateName: 'application',
    appendTo: function(){
        this._super('#content');
    }
});
于 2012-07-02T16:55:17.223 回答
1

如果您使用 master，则模板的插入和更改是通过 outlet 处理的。查看官方指南。

如果您使用的是旧版本的 Ember，则更多的是手动过程。

于 2012-06-25T01:44:19.047 回答