JSFiddle - React, Tailwind, and code Playground

by bmleite

HTML

<div ng-controller="AngularCtrl" ng-app>
    <div ng-repeat="user in users | orderBy:predicate:reverse | limitTo:10">
        <div>
            {{user.name}} and {{user.score}}
        </div>
    </div>
</div>

JavaScript

function AngularCtrl($scope) {
  	$scope.predicate = 'score';
  	$scope.reverse = true;
    $scope.updateScores = function() {
        angular.forEach($scope.users, function(user) {            
            user.score = user.id + 1;
        });
    };
    $scope.users = [{id: 1, name: 'John'}, {id: 2, name: 'Ken'}, {id: 3, name: 'smith'}, {id: 4, name: 'kevin'}, {id: 5, name: 'bob'}, {id: 6, name: 'Dev'}, {id: 7, name: 'Joe'}, {id: 8, name: 'kevin'}, {id: 9, name: 'John'}, {id: 10, name: 'Ken'}, {id: 11, name: 'John'}, {id: 1, name: 'John'}, {id: 2, name: 'Ken'}, {id: 3, name: 'smith'}, {id: 4, name: 'kevin'}, {id: 5, name: 'bob'}, {id: 6, name: 'Dev'}, {id: 7, name: 'Joe'}, {id: 8, name: 'kevin'}, {id: 9, name: 'John'}, {id: 10, name: 'Ken'}, {id: 11, name: 'John'}];  
    $scope.updateScores();
}