Accessibility of $index in ng-show

Question

I try displaying a select when the previous select was checked.

<div ng-repeat="item in collection">

<div ng-show="$index === 0 || $parent.list[$index].nom">
    <select ng-model="$parent.list[$index].nom" ng-options="..."></select>
</div>

1. <div ng-repeat="item in collection">

I loop through collection and I create many selects that there are item in collection.

2. <div ng-show="$index === 0 || $parent.list[$index].nom">

I want to display/hide the parent div of selects with two conditions :

1. I show the div if the index is equal to 0 (for display first select)
2. I show the div if the current ngModel contains the nom

3. <select ng-model="$parent.list[$index].nom" ng-options="...">

I put a dynamic ngModel where each select has his own model like :

_{(source: noelshack.com)}

Test Exemple : I have three options in a select, so I want give opportunity to member to choose each option of the select.

If the member choose an option of select 1 the seconde select show on and If he select an option of second select the third select show on but no more else...

THE PROBLEME HERE : $index in the directive ngShow seem's known with this condition :

$index === 0

but no here :

$parent.list[$index].nom

Answer 1

I think it should be:

<div ng-show="$index === 0 || $parent.list[$index - 1].nom">
    <select ng-model="$parent.list[$index].nom" ng-options="el for el in els"></select>
</div>

Note, that you want to refer previous item in the list, hence $index - 1.