Question

我发现这非常有用stackoverflow link，其中显示了如何创建模态模板。这是他们在该问题中提到的code。

我想扩展此程序并创建两个显示不同内容的模式弹出窗口。但是，我不知道该怎么做。

我尝试使用布尔变量值来确定要在模态弹出窗口中显示哪些数据，但它不起作用。这是我尝试过的。我已经在下面展示了相关部分，可以找到完整的工作程序here。

App.ApplicationRoute = Ember.Route.extend({

  isFirst : false,

  events: {
     open: function() {
           isFirst = true;
           this.render('modal', { into: 'application', outlet: 'modal' });
     },

     openModal: function() {
           isFirst = false;
          this.render('modal', { into: 'application',     outlet: 'modal' });
     },
});

<div class="modal-header">
  <button type="button" class="close" {{action close target="view"}}>&times;</button>

  {{#if isFirst}}
  <h3>Modal header</h3>
  {{else}}
    My Header
  {{/if}}

</div>

两个弹出窗口显示＆＃34; My Header＆＃34;作为标题，表示变量isFirst未设置。

知道如何解决这个问题吗？任何帮助是极大的赞赏！谢谢！

Answer 1

两个弹出窗口都显示“我的标题”，因为该模板引用isFirst属性ApplicationController。要从ApplicationRoute中的事件设置该属性，请尝试以下操作：

open: function() {
  this.controller.set('isFirst', true);
  this.render('modal', { into: 'application', outlet: 'modal' });
},

openModal: function(arg) {
  this.controller.set('isFirst', false);
  this.render('modal', { into: 'application',     outlet: 'modal' });
},

在这里工作jsbin：http://jsbin.com/OTiRerA/1/

如何在ember中重用多个弹出窗口中的模态模板？

1 个答案: