Привязка контекста при использовании вложенных блоков в Ember Handlebars

Я просто наткнулся на emberJS и подумал, что стоит попробовать его для моего следующего веб-приложения.

Что я на самом деле планирую сделать, так это показать список объектов в двух измерениях (это может быть таблица).

Что у меня так далеко:

<script type="text/x-handlebars">
<table width="100%" style="text-align:left">
  <tr>
    <th>
    </th>
    {{#each App.MyController.getColumnValues}}
      <th>{{this}}</th>
    {{/each}}
  </tr>
  {{#each App.MyController.getRowValues}}
    <tr>
      <th>{{this}}</th>
      {{#each App.MyController.getColumnValues}}
        {{view App.CountView rowBinding="this" columnBinding="../this"}}
      {{/each}}
    </tr>
  {{/each}}
</table>
</script>

и для countView:

<script type="text/x-handlebars" data-template-name="countView">
  <td>{{view.row}} - {{view.column}}</td>
</script>

Как видите, я хочу, чтобы в каждой ячейке была таблица текущего значения столбца И строки. Все работает, кроме columnBinding. Как я читал на странице Handlebars, {{../this}} - это способ обратиться к родительской области шаблона. В двух фигурных скобках (без создания для него дополнительного представления это работает довольно хорошо. Но позже мне нужно вызвать функцию, передающую ей значение столбца и строки, и подумать (чтобы сделать его понятным) представление было бы неплохо на этом этапе,

Любые идеи, как получить доступ к родительской области шаблона и передать его в countView?

1 ответ

Решение

Чтобы избежать путаницы, вы всегда можете использовать переменные в {{each}} блок, как в этом случае, вы можете попробовать так:

{{#each row in App.MyController.getRowValues}}
  <tr>
    <th>{{row}}</th>
    {{#each column in App.MyController.getColumnValues}}
      {{view App.CountView rowBinding="row" columnBinding="column"}}
    {{/each}}
  </tr>
{{/each}}

Позвольте мне знать, если это помогает...

Другие вопросы по тегам