Kazordomo
Kazordomo

Reputation: 57

Angular, filter and show one object of array

I have a list of names that is connected to different objects in an array. I would like to, whenever you click one of the names, get the values and output them in another list respective to that that object. For right now I console.log the right values, but don't know how to output it:

<a href="#" id="name" ng-click="updateIndex($index);">{{ person.name }}</a>

Controller:

$scope.updateIndex = function(index) {
            console.log($scope.person[index]); //Logs the right values
        }

How can I output the values from the object which name is clicked to:

<div class="wrap" ng-repeat="per in person">

        <div class="box">
            {{ person.name }}
        </div>

        <div class="box">
           {{ person.age }}
        </div>

        <div class="box">
           {{ person.town }}
        </div>

        <div class="box">
           {{ person.country }}
        </div>

        <div class="box">
           {{ person.gender }}
        </div>

</div>

Thanks!

Upvotes: 0

Views: 62

Answers (2)

Zdenek Hatak
Zdenek Hatak

Reputation: 1145

Just assign $scope.person[index] to another variable in the click function and output it in the template.

Upvotes: 0

Suren Srapyan
Suren Srapyan

Reputation: 68665

You can store the variable in the variable an use it:

$scope.updateIndex = function(index) {
     $scope.currentPerson = $scope.person[index] 
}

<div class="wrap" ng-repeat="per in currentPerson">

    <div class="box">
        {{ person.name }}
    </div>

    <div class="box">
       {{ person.age }}
    </div>

    <div class="box">
       {{ person.town }}
    </div>

    <div class="box">
       {{ person.country }}
    </div>

    <div class="box">
       {{ person.gender }}
    </div>
</div>

Upvotes: 1

Related Questions