Nativescript Repeater databinding
<p>I want to create a dynamic menu list, and apply  class at selected item.
I have an array of menu entries, <code>menuItems</code> which is an <code>observableArray</code>.</p>

<p>The page binding contain two entries : </p>

<ul>
<li>menuItems</li>
<li>selectedPage</li>
</ul>

<p><a href="https://i.stack.imgur.com/MiywC.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/MiywC.png" alt="console.log(page.bindingContext)"></a></p>

<p>The idea is simple : apply a different class when the <code>selectedPage</code> parameter equal the page name to indicate to user which page is currently displayed.</p>

<pre><code>&lt;Repeater items="{{menuItems}}" id="repeater"&gt;
  &lt;Repeater.itemTemplate&gt;
    &lt;Label text="{{name}}" class="{{ $parents['Page'].selectedPage == name ? 'selected' : '' }}" tap="navigate" /&gt;
  &lt;/Repeater.itemTemplate&gt;
&lt;/Repeater&gt;
</code></pre>

<p>This doesn't work, so I have made some tests, and a strange thing happened.
When I use a simple <code>Label</code> into my <code>Repeater</code> to test my bindings, I can acces the good datas.</p>

<hr>

<pre><code>&lt;Label text="{{name}}"/&gt;
</code></pre>

<p>Display the good <code>menuItems</code> entry name.</p>

<hr>

<pre><code>&lt;Label text="{{$parents['Page'].selectedPage}}"/&gt;
</code></pre>

<p>Display the good <code>selectedPage</code> entry name.</p>

<hr>

<p><strong>But</strong>, these code samples doesn't work together. Both works only independently.</p>

<p>So, I'm a bit lost, is using a <code>$parents</code> based selector change the context inside the <code>Repeater</code> ?</p>