AngularJS expand collapse number link to list of people, collapse back to number -

AngularJS expand collapse number link to list of people, collapse back to number -

i want implement next scenario linkedin does:

let's assume create comment , there people whom comment:

comment blah blah blah you, jane jackson , 5 more

when click 5 more show total list of people:

you, jane jackson, jack black, jeny jack, bill gates, steve mobs , steve jobless show less...

where show less actual link 1 time clicked colapse list format:

you, jane jackson , 5 more

assuming have info model retrived service:

$scope.model = [{ userid: '', firstname: '', lastname: '' }];

where userid used format actual url user profile ...

this start:

js:

$scope.limittonumber = 2;

html:

<span ng-repeat="person in model | limitto: limittonumber "> {{person.firstname}} {{ person.lastname }} <span> <span ng-if="model.length > 2"> <span> , {{model.length -2}} people liked <!-- utilize ng-pluralize here singular/plural --> <span ng-if="limittonumber == 2" ng-click="limittonumber=10000000">show more </span> <span ng-if="limittonumber != 2" ng-click="limittonumber=2">show less </span> </span>

angularjs angularjs-directive angularjs-ng-repeat