Question

所以这是我的HTML：

<script type="text/x-handlebars">
    <div id="top-panel">
        <h1>{{title}}</h1>
    </div>
    <div id="wrapper">
        {{outlet}}
    </div>
</script>

<script type="text/x-handlebars" id="home">
    <ul>
        {{#each}}
        <li>{{name}}</li>
        {{/each}}
    </ul>
</script>

<script src="js/app.js"></script>
<script src="js/router.js"></script>

我的app.js：

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

我的router.js：

App.Router.map(function () {
    this.resource("home", { path: "/" });
});

App.HomeRoute = Ember.Route.extend({
    model: function () {
        $.getJSON("mocks/stub1.json", function (data) {
            return data;
        });
    }
});

现在我的问题是如何将变量发送到默认模板（在{{outlet}}内呈现主页模板的模板）。

正如您所见，我希望{{title}}成为动态变量。问题是，我已将主路由分配到/ path，因此我不确定如何使{{title}}动态化。

Answer 1

您调用它时的默认模板名为application模板。因此，您可以根据需要在title或ApplicationController上定义ApplicationRoute属性。如果您使用控制器：

App.ApplicationController = Ember.ObjectController.extend({
  title: 'Foo',
  ...
});

希望它有所帮助。

EmberJS将变量传递给默认模板

1 个答案: