Within this ng-repeat loop, I intend to display the first two rows. Upon clicking "Show More," how can I switch the CSS from display:block to something else? The Show More button should toggle the visibility.
JSON
"one":[{
"name":"Raspberry Lemon Cake"
}]
"two":[{
"name":"Raspberry Lemon Cake"
}]
"three":[{
"name":"Raspberry Lemon Cake"
}]
"four":[{
"name":"Raspberry Lemon Cake"
}]
"five":[{
"name":"Raspberry Lemon Cake"
}]
HTML
<div class="GridBrd" ng-repeat="Detail in Results"
ng-class='{showflight: $index > 1}'></div>
<span class="moreOpt" ng-click="show()">
<a href="javascript:void(0);">Show More</a>
</span>
CSS
.showflight{
display:none;
}
Script
$scope.show = function (){
***----How can I manipulate the ng-class here to change between block and none?----***
}