Execute the code below as is, it currently works well but I'm looking for a way to achieve the same functionality without cluttering the AngularJS code.
<html>
<head>
<title></title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
</head>
<body ng-app="newapp" ng-controller="newctrl">
<div ng-repeat="x in names">
<div data-ng-click="toggleCompanyArr(['nav_' + x.id])"><a href="">This is id : {{x.id}}</a></div>
<div id="nav_{{x.id}}" style="display:none">{{x.firstname}} {{x.lastname}}</div><br><Br><Br>
</div>
</body>
<script>
var app = angular.module('newapp',[]);
app.controller('newctrl', function($scope){
$scope.names=[
{"id":"1","firstname":"Akhilesh","lastname":"Kumar"},
{"id":"2","firstname":"Aman","lastname":"Kumar"},
{"id":"3","firstname":"Mithilesh","lastname":"Kumar"}
];
$scope.toggleCompanyArr = function(val){
$("#"+val).toggle();
};
});
</script>
</html>