jsRender, как передать дочерний индекс родителю - PullRequest
Новая
       27

jsRender, как передать дочерний индекс родителю

0 голосов
/ 08 ноября 2019

У меня есть заголовок, который должен отображаться (1 из X) на странице.

Я могу получить 'X' из длины массива.

, поэтому у меня есть цикл: 

<div class="modal-dialog" role="document">
                    <div class="modal__content modal-outerContent">
                        <div class="modal-title">
                            <h3 class="giftMessage__title">
                                add a gift message
                                {{if GiftMessages ~Count > 1 }}
                                <span class="giftMessage__highlight">
                                    ({{:#getIndex() + 1}} of {{:GiftMessages.length}})
                                </span>
                                {{/if}}
                                <button type="button" class=" modal__close" title="Close modal" data-dismiss="modal">
                                    <span class="icon icon-close"></span>
                                    <span class="hide">Close Modal</span>
                                </button>
                            </h3>
                        </div>
                        <div class="modal-innerContent">

                            {{for GiftMessages ~Count=GiftMessages.length}}
                            <div class="js-basket-message-form hide form" data-step="{{:#index + 1}}">
                                {{include tmpl="#giftMessageTemplate" /}}
                            </div>
                            {{/for}}

Так что, когда я повторяю цикл for, как передать текущее значение индекса потомка родителю. Так, что строка с data-step = "{{: #index + 1}}" будет возвращена родителю, где у меня в данный момент есть {{: getIndex () + 1}}

Мой набор данных: 

 item {
   message {
      to
      from
      messageContent
    }
   message {
      to
      from
      messageContent
    }
 }
 item { …..

1 Ответ

0 голосов
/ 11 ноября 2019

Если вы хотите вывести массив массивов, можете сделать это: 

  {{for item itemVar="~item"}}
    {{for ~item itemVar="~inner"}}
    .....
    {{/for}}
  {{/for}}

Для вашего набора данных: 

var data = {
    item: [
    [
        {to: "a", from: "b", messageContent: "foo"},
      {to: "b", from: "a", messageContent: "bla"}
    ],
    [
        {to: "a1", from: "b1", messageContent: "foo1"},
      {to: "b1", from: "a1", messageContent: "bla1"},
      {to: "b2", from: "a2", messageContent: "bla2"},
    ]
  ]
};

Шаблон выглядит следующим образом: 

  {{for item itemVar="~item"}}
    <div>item {{:#index}} </div>
    {{for ~item itemVar="~message"}}
       <div> 
         -- message {{:#index}} 
         <b>from:</b> {{:~message.from}};
         <b>to:</b> {{:~message.to}};
         <b>content:</b> {{:~message.messageContent}};
       </div>
    {{/for}}
  {{/for}}

пример для jsfiddle

Обновление
Нельзя использовать индекс дочернего цикла в родительском цикле. Это не работает так. Предположим, что мы решаем эту проблему, используя c JavaScript, родительский индекс i и дочерний индекс j объявляют их в самом начале, чтобы избежать проблем с видимостью. 

var i,j;

Теперь попробуйте: 

  		
        var i = 0, j = 0;
		for (var i; i < 2; i++) {
			console.log("p:" + i);
			for (var j; j < 3; j++) {
				console.log("ic" + j); // j = current index
			}
			console.log("c:" + j); // j = 3 (last index)
		}

Как вы можете видеть, что это бесполезно.

Обновление 2

Вы можете выдвигать переменныев петлю сверху 

{{for ~item itemVar="~message" ~parent_index=#index}}
   <div>
     -- item {{:~parent_index}}
     ...
...