d_z90 d_z90 - 2 months ago 8
HTML Question

Click an array element, show the element with the same index of another array

I have a list of elements which is plotted via a

ng-repeat
and I am using a
ng-click
to get the index of the element of the array I am clicking on.

This is the html code:

<ul>
<li ng-repeat="period in periodPercentage" ng-click="getIndex('{{period}}')">
{{period}}
</li>
</ul>


And this is what is inside the controller:

$scope.periodPercentage = ['a', 'b', 'c', 'd'];
$scope.getIndex = function(period) {
console.log($scope.periodPercentage.indexOf(period));
};


In another part of the code, I am using again an
ng-repeat
to show the elements of another
array
with the same length.

<ul>
<li ng-repeat="ratio in ratioPercentage">
{{ratio}}
</li>
</ul>


Is there a way to show only the
{{ratio}}
with the same index of
{{period}}
via
ng-show
and hide the other ones?

Thanks in advance for your replies!

Answer

You could do that:

<li ng-repeat="period in periodPercentage" ng-click="getindex($index)">
    {{period}}
</li>

and

<ul>
  <li ng-repeat="ratio in ratioPercentage" ng-show="$index == findex">
    {{ratio}}
  </li>
</ul>

see updated fiddle

Comments