Ember JS基于模型中的内容动态渲染模板

时间:2013-08-27 01:32:03

标签: ember.js nested

我正在尝试以编程方式将不同的模板渲染到基于模型中特定值的命名插座中。

以下是两个JSBin示例:

这个显示了基本结构,但特定的渲染代码被注释掉了。 http://jsbin.com/OhegexO/1/

但是当我尝试在我的路线中使用renderTemplate方法时,它不起作用

http://jsbin.com/OhegexO/2/

我在控制台中看到以下错误

Error while loading route: TypeError {}

Uncaught TypeError: Cannot call method 'connectOutlet' of undefined 

我似乎可以解决这个问题。用例是我想根据模型中的某些参数使用不同的模板。

1 个答案:

答案 0 :(得分:3)

不可否认,我对渲染到命名插座并不是很熟悉,但它似乎不会渲染到尚未渲染的插座中。可以说,有可能不是通过renderTemplate来实现,而是可以允许产品模板正常渲染(不要覆盖renderTemplate),然后将编辑形式延迟渲染到产品模板中(参见第二个jsbin)。这有点尴尬,所以如果你想劫持renderTemplate,请先看看这个jsbin。它们都涉及等待产品模板渲染,然后渲染它。

我相信如果你覆盖renderTemplate挂钩,它会跳过默认渲染,因此永远不会渲染产品模板。经过进一步的调查,这是真的,如果你超级它,它也可以。 BTW this._super()表示也运行此方法的默认实现。

http://jsbin.com/ujiKire/5/edit

使用设置控制器:

http://jsbin.com/OvONejo/1/edit

  setupController: function(controller, model){
     var templateEditForm = model.get('editform');
     var templateInto = 'product';
     var templateOutlet = 'editform';

     console.log("render the [%s] form into the [%s] template, using the [%s] outlet",templateEditForm, templateInto, templateOutlet);    

     // Why does this code not work

     var self = this;
     Ember.run.later(function(){
     self.render(templateEditForm, {   // the template to render
       into: 'product',                // the template to render into
       outlet: templateOutlet,              // the name of the outlet in that template
       controller: controller        // the controller to use for the template
     });
     },1);
   }