Ember.js使用自定义模板链接到不同的对象

时间:2014-05-29 14:26:10

标签: ember.js ember.js-view

我有以下代码用于生成对象的链接,我有一个呈现它的模板,但我想让列表中的每个项目调用不同的模板或显示不同的项目。这可能吗?

  <div class="main-content container"> 
            <div class="container-fluid">
              <div class="col-xs-3">
                <div class="span3">
                  <table class='table'>
                    <thead>
                      <tr><th><h3>Select Your Source</h3></th></tr>  
                        {{#each refRecord in model}}
                          <tr><td>  
                          {{#link-to 'ref' refRecord classNames="fullwidth"}}{{refRecord.type}}{{/link-to}}
                          </td></tr>    
                        {{/each}}
                  </table>
                </div>
              </div>
                <div class="col-xs-9">
                  {{outlet}}
                </div>      
            </div>
        </div>

1 个答案:

答案 0 :(得分:0)

我不确定我是否理解正确,但我以两种方式提出您的问题,要么链接到不同的模板,要么将每个项目呈现在列表中不同。

链接到不同的模板

您可以使用属性而不是链接到语句中的字符串来创建动态链接。

<ul>
  {{#each item in model}}
    <li>{{#link-to item.template item}}{{item.color}}{{/link-to}}</li>
  {{/each}}
</ul>

http://emberjs.jsbin.com/xarixiyu/1/edit

呈现不同的每个项目

这有点不同,因为render不允许获取属性并动态解析名称。但是你仍然可以使用if语句并以不同的方式呈现不同的项目。

{{#each item in model}}
  <li>
    {{#if item.foo}}
      {{render 'foo' item}}
    {{/if}}
    {{#if item.bar}}
      {{render 'bar' item}}
    {{/if}}
  </li>
{{/each}}

http://emberjs.jsbin.com/xarixiyu/2/edit