或者将控制器绑定到两个不同的视图。
我这样做是因为我的'home'
视图获得了PostsController
的内容..但如果你能帮助我,我需要真正的方法来做到这一点!
HomeController: Ember.ArrayController.extend({
init: function() {
setTimeout(function() {
App.router
.get('homeController')
.set('content', App.router.get('postsController').get('content'));
}, 0);
}
})
(此时使用上一版本 SHA:83542a6 )
答案 0 :(得分:3)
我不太明白你的问题。下面的解决方案有什么问题? (original jsFiddle here) (updated jsFiddle here)
(更新:添加骨架路由器)
JavaScript / Ember:
// Application
App = Ember.Application.create({
ApplicationController: Ember.Controller.extend(),
ApplicationView: Ember.View.extend({
templateName: "application-view",
}),
Router: Ember.Router.extend({
// initialState of Ember.Router is "root"
root: Ember.Route.extend({
// "index" can be called whatever we want
index: Ember.Route.extend({
route: '/',
enter: function(router) {
console.log("entering root.index from", router.get('currentState.name'));
},
connectOutlets: function(router) {
console.log("entered root.index, fully transitioned to", router.get('currentState.path'));
// Demo: read and write from router's connectOutlets
console.log("Router says, A:", App.get("aController").get('content'));
console.log("Router says, B:", App.get("bController").get('content'));
App.get("aController").pushObject({name: "Network switch", color: "beige", type: "Cisco"});
console.log("Router says, A:", App.get("aController").get('content'));
console.log("Router says, B:", App.get("bController").get('content'));
}
})
// ...
// (add routes here)
// ...
})
})
});
// Controllers
App.aController = Ember.ArrayController.create({
content: [],
addContact: function(contact) {
this.content.push(contact);
}
});
App.bController = Ember.Object.create({
contentBinding: "App.aController.content"
});
// Demo: Change a (shows up in b)
App.aController.set('content', [
{name: "Apple", color: "red", type: "fruit"},
{name: "Banana", color: "yellow", type: "fruit"},
{name: "Sports car", color: "black", type: "vehicle"},
{name: "Sun", color: "white", type: "star"},
]);
// Demo: Change b (shows up in a)
(function() {
var temp = App.aController.get('content');
temp.push({name: "Linus", color: "n/a", type: "human"});
App.bController.set('content', temp);
})();
HTML / Handlebars:
<script type="text/x-handlebars" data-template-name="application-view">
<div id="my-app">
<h1>aController</h1>
{{#collection tagName="ul" contentBinding="App.aController.content"}}
{{#with view.content}}
Name: {{name}}, Color: {{color}}, Type: {{type}},
{{/with}}
{{/collection}}
<h1>bController</h1>
{{#collection tagName="ul" contentBinding="App.bController.content"}}
{{#with view.content}}
Name: {{name}}, Color: {{color}}, Type: {{type}},
{{/with}}
{{/collection}}
</div>
</script>