ember.js - 如何将模板渲染到全局组件/插座中

Question

我有一个关于将路由渲染到组件/插座的问题。

我想要一个位于应用程序模板中的组件，其作用类似于模态/弹出框。

在渲染路由时，我想将模板渲染到组件中，当内容发生变化时，在组件中运行一些打开/关闭弹出框的逻辑。

我希望有人能启发我如何去做这件事？

目前我在应用程序模板中有一个组件，其中有一个命名的插座（见下文）。我可以将路由渲染到那个命名的插座中，但是我不知道如何在内容更改时获取内容的更改。单击不同的链接将更改该插座的内容。

有什么想法吗？完成我想做的更好的方法？

应用程序/模板/application.hbs

{{#primary-popover}}
  {{outlet 'primary-popover'}}
{{/primary-popover}}

/app/profile/route.js

import Ember from 'ember';

export default Ember.Route.extend({

  renderTemplate() {
    this.render('profile', {
      outlet: 'primary-popover'
    });
  }
});

Answer 1

我认为解决您的问题的最佳方法是使用液体火http://ef4.github.io/liquid-fire/#/modals。它是 ember 核心团队库推荐的，也得到了很好的支持。它有很好的模态组件，可以用link-to组件或通过this.transitionTo编程方式触发。