Ember js:使用数据在一个页面上加载多个模板

Question

我正在使用ember.js中的应用程序.我向你们所有人提出几个问题.首先让我们讨论我的应用点,然后讨论我面临的问题.

1. 应用程序就像绘制一个像"自动cad"这样的计划.为此我使用的是d3.js库
2. 出于绘图的目的,我们有不同的部分,如火,水等.卫星所有这些部分都有不同的svg容器用于绘图.

3. 在这之后,我有一个模块,通过三种方式将此部分通过电子邮件发送给特定的电子邮件ID

   3.1当前部分明智的电子邮件(意味着如果我们在火灾部分绘图然后如果我们发送电子邮件然后svg的火灾部分将作为pdf的形式发送)(完成)

   3.2一次所有部分的svg内容都是PDF格式.(这里我的实际问题开始了)

在这一点上,所有部分的电子邮件我都遇到问题,一次检索所有部分svg.因为当前部分已经加载到视图中,带有数据的模板,但是如何使用其绘图数据(svg元素)获取所有部分模板.

我创建了这样的路线

emailPDF = Ember.Route.extend({

    setupController: function(controller, model)
    {
        alert("Controller setup");
        this.controllerFor('fire').set('model', model);
        this.controllerFor('gas').set('model', model);
    },
    renderTemplate: function() {
        this._super();
        this.render('fire', {           // the template to render
            into: 'emailPDF',       // the template to render into
            outlet: 'fire',              // the name of the outlet in that template
            controller: 'fire'        // the controller to use for the template
        });
        this.render('gas', {
            into: 'emailPDF',
            outlet: 'gas',
            controller: 'gas'
        });
    }
});

模板如下:

<div id="fire_test">
    {{outlet 'fire'}}
</div>
<div id="gas_test">
    {{outlet 'gas'}}
</div>

然后我像这样从一个控制器转换这条路线:

this.transitionToRoute('emailPDF');

但是在allSections模板中,我得到了以前的模板,我已经在火灾和气体出口处打开,无法渲染火灾和气体模板.

请告诉我,如果我做错了什么......

Answer 1

我相信您想要在这里做的是这样的...您需要创建一条路线，例如 HomeAndContact。在此路线中创建一个模板。这里有 2 个选项，使模板类似于：

{{outlet 'home'}}
{{outlet 'contact'}}

或者你也可以这样做：

{{render 'home'}}
{{render 'contact'}}

我建议不要使用第二个选项，因为它将被弃用/与 Ember 未来所做的事情不一致。

要执行第一个选项，您需要在 HomeAndContactRoute 中包含一些如下代码：

HomeAndContactRoute = Ember.Route.extend({
  setupController: function(controller, model) {
    this.controllerFor('home').set('model', model);
    this.controllerFor('contact').set('model', model);
  },
  renderTemplate: function() {
    this.render('home', {           // the template to render
      into: 'homeAndContact',       // the template to render into
      outlet: 'home',              // the name of the outlet in that template
      controller: 'home'        // the controller to use for the template
    });
    this.render('contact', {
      into: 'homeAndContact',
      outlet: 'contact',
      controller: 'contact'
    });
  }
});

我希望这有帮助。