Answer the question
In order to leave comments, you need to log in
AngularJS ng-repeat optimization, long page rendering, how to fix?
Hello.
There is such a list consisting of 50+ objects in an array that is accordingly output through ng-repeat in html, how can I optimize page rendering due to ng-repeat output?
List
//
var tableUsers = angular.module('tableUsers', []);
tableUsers.controller('tableUsers_list', ['$scope', function($scope){
$scope.list = [
{
id:1,
initials:'Jana Pallaske',
yearStart:'2012',
visits:183202,
rate:17483,
ip:'174.100.87.24',
status:'active'
},
{
id:2,
initials:'Carolina Schuchardt',
yearStart:'2011',
visits:198102,
rate:22013,
ip:'140.172.33.10',
status:'locked'
}
]
}]);
<tr data-ng-repeat="user in list | orderBy:sort:reverse">
<td>{{user.id}}</td>
<td>{{user.initials}}</td>
<td>{{user.yearStart}}</td>
<td>{{user.visits}}</td>
<td>{{user.rate}}</td>
<td>{{user.ip}}</td>
<td data-status="{{user.status}}">{{user.status}}</td>
</tr>
Answer the question
In order to leave comments, you need to log in
Optimize for what? Is this rendering slow for you?
50 elements is nothing at all, but you can precalculate sorting, because filters are called often enough.
You can also try adding track by user.id to ng-repeat.
You can also remove bidirectional binding by adding two colons to all records before the field name, for example: {{::user.id}}
Didn't find what you were looking for?
Ask your questionAsk a Question
731 491 924 answers to any question