Index problem in repeat.for in child element

Help Requests
1 
<template>
  <require from="./faq.css"></require>
   <div class="cst-pg033">
    <div class="cst-pg033-faq-header"><a href="#" target="_blank">${pageLabels.faqName}'s</a></div>
    <div class="cst-pg033-faq-body">
      <div class="cst-pg033-faq-body-down" repeat.for="ques of questions"> 
        <div class="cst-pg033-faq-heading">${ques.heading}</div>
        <div class="cst-pg033-faq-pop" repeat.for="data of ques.questions" click.trigger="evtArrowClick($index)">
          <div class="cst-pg033-faq-collapse">
          <div class="cst-pg033-faq-disclosed">${data.questionDesc}</div>
          <div class="cst-pg033-faq-shape ${ques.isShow ? 'cst-pg033-faq-shape1': 'cst-pg033-faq-shape'}"></div>
         </div>
          <div class="cst-pg033-faq-closed ${ques.isShow ? 'cst-pg033-faq-show': 'cst-pg033-faq-hide'}" 
          show.bind="ques.isShow">${data.answer}</div>
        </div>
      </div>
    </div>
  </div>

</template>

Screenshot from 2021-06-11 11-11-41
Screenshot from 2021-06-11 11-11-411366×768 209 KB

above are the images for the reference please help me out of it

2

Hi,

I’m not 100% sure what you mean, but could it be your function definition for evtArrowClick? I don’t think you need the $ for the index parameter. Not sure if that makes a difference?

3

I think it’s because you try to use the $index and $parent that are available in the template inside the view-model. You pass the $index to the function (including the $, but I don’t think it matters - though it’s not used generally), but you also try to use the $parent variable.
In this case, just pass both variables to the view-model and use these as local vars (like index and parent).

4

Can you please clarify what you are expecting?

$index should be accessible (because you passed it as a parameter (but it can be whatever name))
but… $parent isn’t defined anywhere in your code…
In your bind function, you assigned it to this.parent, is that what you are trying to access?

Kremnari