嗨,非常感谢您的回答! 我想了解Ember及其结构。
这就是我坚持的地方:我有一个可以在我的网络应用程序(模态视图)中随时随地添加的视图。我想将此视图与特定控制器链接以处理事件,状态和其他行为。
但我没有发现它是如何可能的!这是我的应用程序结构中的错误还是来自其他地方的问题? (我?)
以下是代码的相关部分。
/views/post_news_popup.js
App.PostNewsPopupView = Ember.View.extend({
templateName: '_post-news',
close: function() { /*...*/ },
save: function() { /*...*/ }
});
的index.html
{{view App.PostNewsPopupView}}
...
<script type="text/x-handlebars" data-template-name="_post-news">
<form {{ action "save" on "submit"}}>
{{view Ember.TextField valueBinding="name" placeholder="Fill in a name..."}}
{{view Ember.TextArea valueBinding="description" placeholder="Fill in a description..."}}
<button {{action 'close'}}>Cancel</button>
<button>Post news</button>
</form>
</script>
控制器/ post_news_controller.js
App.PostNewsPopupController = Ember.ObjectController.extend({
actions: {
close:function() { /*...*/ },
save:function() { /*...*/ }
}
});
我没有找到将PostNewsPopupController链接到PostNewsPopupView的方法。 我尝试了很多东西,但是控制器的功能和视图的功能都没有被调用。
我知道在浏览路由时会自动设置控制器,但是这里没有特定的路由,我不想把所有代码都放在ApplicationController中。
感谢您帮助我,抱歉,如果问题是......愚蠢! :d
答案 0 :(得分:1)
您应该将以下代码添加到与模板相关的路由中,您当前正在使用视图助手(我的名字不是: - ):
将此添加到您的路线:
renderTemplate: function(controller, model) {
this._super(controller, model);
this.render('postNewsPopup', {
outlet: 'modalOutlet',
});
}
将插座添加到要添加视图的模板中
{{outlet modalOutlet}}
这会将PostNewsPopupView渲染到连接到PostNewsPopupController的modalOutlet。
更多信息:
render方法需要更多参数。这是一个完整的渲染方法示例:
this.render('your', { // the template/view to render
into: 'index', // the template to render into
outlet: 'someOutlet', // the name of the outlet in that template
controller: this.controllerFor("another") // the controller to use for the template
});
这会将 App.YourView 类型的视图呈现到带有名为 someOutlet 的插座的索引模板中。该视图将连接到 App.AnotherController 的控制器实例。
答案 1 :(得分:1)
请检查以下内容是否有用。在声明视图时指定上下文。
App.PostNewsPopupView = Ember.View.extend({
templateName: '_post-news',
controller:App.PostNewsPopupController.create()
});
App.PostNewsPopupController = Ember.ObjectController.extend({
actions: {
close:function() { /*...*/ },
save:function() { /*...*/ }
}
});