如何使用最新版本的ember.js创建模态弹出窗口?我发现的每一个例子都使用了connectOutlet,它在一段时间之前已经被弃用了,而我刚刚开始使用的事实并没有帮助.
我已经在我的应用程序模板中有一个命名的插座,但是如何将我的模态弹出视图从控制器事件呈现到此插座?还是应该使用路由事件?
解决方法
亚当·霍金斯刚刚发表了一个关于这个话题的优秀文章,你可以在这里找到:
http://hawkins.io/2013/06/ember-and-bootstrap-modals/
总结:
>在application.hbs中包含{{出口模态}}
通过使用事件从路由器渲染出来
>动画触发的视图的didInsertElement钩子和它的接近动作
> Modal的关闭动作应该瞄准视图,等待动画完成,然后再向路由器发送关闭事件
从亚当的jsfiddle:
App.ApplicationRoute = Ember.Route.extend({ events: { open: function() { this.render('modal',{ into: 'application',outlet: 'modal' }); },close: function() { this.render('nothing',save: function() { alert('actions work like normal!'); } } }); App.ModalView = Ember.View.extend({ didInsertElement: function() { this.$('.modal,.modal-backdrop').addClass('in'); },layoutName: 'modal_layout',close: function() { var view = this; // use one of: transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd // events so the handler is only fired once in your browser this.$('.modal').one("transitionend",function(ev) { view.controller.send('close'); }); this.$('.modal,.modal-backdrop').removeClass('in'); } });
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。