Есть ли способ обойти конфликт имен во вложенных структурах в моих шаблонах Mustache.js?

У меня действительно возникают проблемы с конфликтами имен в моих шаблонах Mustache (с помощью Mustache.js). Этот пример иллюстрирует эти две проблемы:

Я передаю эти данные:

{'recs': {'code': 'foo', 'id': 1
          'childRecs': [{'id': 2},
                        {'code': 'bar', 'id': 3}]
         }
}

В этот шаблон:

{{#recs}}
  Record ID: {{id}}
  {{#childRecs}}
    This child code is: [{{code}}] and its parent ID is: {{id}}
  {{/childRecs}}
{{/recs}}

Ожидаемое:

Record ID: 1
This child code is: [] and its parent ID is 1
This child code is: [bar] and its parent ID is 1

Актуально:

Record ID: 1
This child code is [foo] and its parent ID is 2
This child code is [bar] and its parent ID is 3
  1. Во вложенном нет пути {{#childRecs}} заблокировать доступ к родителю {{#recs}}{id}}{{/recs}} поле - оно перезаписывается {{#childRecs}}{{id}}{{/childRecs}}

  2. Если переменная в {{#childRecs}} отсутствует, и родительская переменная с тем же именем существует, нет способа предотвратить ее печать родительской переменной.

Мои вложенные структуры очень глубоки, и существует много конфликтов имен, поэтому переименование их таким образом, чтобы они не сталкивались, не является приемлемым вариантом. Есть ли другой способ решить мои проблемы?

1 ответ

Решение

Я вижу два варианта:

  • Обогащайте данные на стороне клиента перед отправкой на рендеринг. Например, вы можете перебрать все childRecs и добавить новое свойство parentId - и затем соответственно обновить свой шаблон, или

  • Используйте http://www.handlebarsjs.com/ - он сохраняет синтаксис усов, но добавляет несколько полезностей, таких как доступ к родительскому контексту (через ../). Например:

    {{#recs}}
        Record ID: {{id}}
        {{#childRecs}}
            This child code is: [{{code}}] and its parent ID is: {{../id}}
        {{/childRecs}}
    {{/recs}}
    
Другие вопросы по тегам