Ember.js EmberJS-将单独的路线作为模式呈现到特定的出口

在我的EmberJS应用程序中，我有两条单独的路线，如下所示

路线A-“主/书籍/添加” 路线B-“主要/作者/添加”

我在路线A模板中有一个“添加作者”按钮，当用户按下该按钮时，我希望在模式中加载和渲染路线B以添加新作者

我知道，通过使用route的render方法来渲染route B模板和相应的控制器，可以实现更简单的效果。 但是在这种情况下，“main/authors/add.js”文件中路由B的“model”钩子不会被调用

如果有人能建议我一种方法，将一条单独的路线渲染成一个模式，那将是非常好的

编辑-尽管这是完全有效的（渲染为使用命名插座的前提），但在Ember 1.1中，视图现在已被弃用。使用组件也可以实现同样的效果

是的，你可以这样做：

您要做的是在模板中创建一个模态，并向其中指定一个命名的插座（或创建一个具有插座的模态视图）：

在

模态.hbs中

：

<div class='modal'>
    {{outlet "modalContent"}}
</div>

最后，您希望在路由中创建一个方法，该方法处理将特定内容呈现到outlet中的问题：

App.TriggerRoute = Em.Route.extend({
    actions: {
        reroute: function(route) {
            this.render(route, {into: 'modal', outlet: route});
        }
    }
});

因此，本质上，您正在将模板（称为“modalContent”）呈现到模板/视图（称为“modal”）中的特定出口（称为“modalContent”）

您还需要编写一些逻辑来触发模式在元素插入时打开。为此，我将使用

modal

视图中的

didInsertElement

操作：

App.ModalView = Em.View.extend({
    didInsertElement: function() {
        this.$.css("display", "block");
        //whatever other properties you need to set to get the modal to pop up
    }
});

---

感谢您的快速响应Fishbowl。有没有一种方法不使用视图就可以做到这一点？比如，直接渲染到另一个出口的路线。好吧，视图现在已经被弃用了（我的答案是基于我写的一篇旧博文）我只是想了解如何使用组件，但从根本上说，如果您将按钮上的单击操作连接到“重新路由”功能，无论是在控制器还是路由中，您都应该能够执行相同的操作，渲染到命名出口的基本前提仍然有效。恐怕重新路由功能能够调用respec使用可用的挂钩（如“模型”）创建一条独立的路线。我们不能将一条单独的路线加载到特定的出口吗？

App.TriggerRoute = Em.Route.extend({
    actions: {
        reroute: function(route) {
            this.render(route, {into: 'modal', outlet: route});
        }
    }
});

App.ModalView = Em.View.extend({
    didInsertElement: function() {
        this.$.css("display", "block");
        //whatever other properties you need to set to get the modal to pop up
    }
});