1
Я использовал ng-repeat для отображения некоторых данных из массива. Но данные слишком большие, поэтому я использовал ограничение с помощью кнопки ng-repeat и больше для загрузки большего количества элементов из массива. Теперь я хочу использовать анимацию, которая даст эффект расширения. Как я могу сделать с угловым и ng-анимированием? Here - это то, что я сделал.Анимированная загрузка больше кнопки с угловым ng-repeat
var myApp = angular.module('myApp', []);
myApp.controller('myController', function($scope) {
$scope.countries = [
"ut",
"duis",
"enim",
"deserunt",
"ea",
"in",
"in",
"deserunt",
"ad",
"tempor",
"mollit",
"nisi",
"dolor",
"exercitation",
"ex",
"excepteur",
"nisi",
"irure",
"nostrud",
"aliqua",
"voluptate",
"nisi",
"anim",
"dolore",
"magna",
"Lorem",
"commodo",
"exercitation",
"consequat",
"cillum",
"elit",
"elit",
"pariatur",
"sit",
"fugiat",
"anim",
"aliquip",
"consectetur",
"excepteur",
"in",
"commodo",
"do",
"mollit",
"exercitation",
"duis",
"duis",
"sit",
"aute",
"sint",
"sunt",
"exercitation",
"occaecat",
"culpa",
"sit",
"commodo",
"esse",
"incididunt"
]
});<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp">
<div ng-controller="myController">
<ul ng-init="limit=5">
<li ng-repeat="country in countries |limitTo:limit track by $index">{{country}}</li>
<li>
<button ng-click="$parent.limit=countries.length" ng-if="limit==5">
More
</button>
<button ng-click="$parent.limit=5" ng-if="limit!=5">
Less
</button>
</li>
</ul>
</div>
</div>