当我使用EmberJs点击{{#linkTo}}时,我想看到子内容 这是模板文件
<script type="text/x-handlebars" id="application">
{{outlet}}
</script>
<script type="text/x-handlebars" id="markets/sources">
{{#each model }}
<span>{{source_channel}}</span>
<span>{{handle}}</span>
{{/each}}
</script>
<script type="text/x-handlebars" id="markets">
<div class="leftside">
{{#each model }}
<span>{{name}}</span>
<span>{{created}}</span>
{{#linkTo 'markets.sources' this class="link" }}<span>go to</span>{{/linkTo}}
{{/each}}
</div>
<div class="rightside">
{{outlet}}
</div>
</script>
这是文件定义路线。
var App = Ember.Application.create();
App.Router.map(function() {
this.route("index", {path: "/"});
this.resource('markets', {path: "/markets"}, function() {
this.route("sources", { path: "/:markets_id" });
});
});
App.IndexRoute = Ember.Route.extend({
redirect: function() {
this.transitionTo('markets');
}
});
App.MarketsRoute = Ember.Route.extend({
model: function () {
return App.Markets.find();
}
});
App.MarketsSourcesRoute = Ember.Route.extend({
model: function(){
return App.Sources.find();
},
serialize: function(model) {
return { markets_id: model.id };
}
});
这是模型文件
App.Store = DS.Store.extend({
revision: 12,
adapter: DS.FixtureAdapter
});
App.Markets = DS.Model.extend({
name: DS.attr("string"),
created: DS.attr("string")
});
App.Sources = DS.Model.extend({
source_channel: DS.attr("string"),
handle: DS.attr("handle")
});
App.Sources.FIXTURES = [
{id:1, markets_id:"1310", source_channel:"sc1", handle: "hn1"},
{id:2, markets_id:"1310", source_channel:"sc2", handle: "hn2"},
{id:3, markets_id:"1310", source_channel:"sc3", handle: "hn3"},
{id:4, markets_id:"1512", source_channel:"sc4", handle: "hn4"},
{id:5, markets_id:"1512", source_channel:"sc5", handle: "hn5"}
];
App.Markets.FIXTURES = [
{id:"1310", name:"test1", created:"2012-2-3" },
{id:"1320", name:"test2", created:"2012-2-13" },
{id:"1512", name:"test3", created:"2012-2-23" }
];
这是控制器部分
App.MarketsController = Ember.ObjectController.extend({});
App.MarketsSourcesController = Ember.ObjectController.extend({});
在这里,我看不到我想要的结果._ 当我点击左侧的一些锚标签时,它会在右侧显示黑色内容 我认为,“来源”模型没有与“市场/ sor”模板相结合 当我在leftside中单击锚标记时,我希望看到源模型的正确结果。
如果有可能,我希望在jsbin或jsfiddle上看到结果
答案 0 :(得分:1)
原因是您的App.Markets
不包含属性source_channel
和handle
。
您可能希望调用model
的{{1}}挂钩来获取正确的模型。但App.MarketsSourcesRoute
将不会被调用,而您通过model
帮助程序传递的内容将是模型,在您的情况下,它将是linkTo
中的单行。如Ember guides
具有动态段的路径只有在通过URL输入时才会调用其模型钩子。如果通过转换输入路由(例如,当使用linkTo Handlebars帮助程序时),则已经提供了模型上下文并且不执行钩子。没有动态段的路由将始终执行模型挂钩。
因此,最好在App.Markets
中调用App.Sources.find()
,因为它始终会被调用。
我已更新您的jsbin。如果您有任何疑问,请退回。