JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.3/angular.min.js"></script>
<div ng-app='app'>
    <div ng-controller="MainCtrl">
        <input type='number' ng-model='pages' min='1'>
        <input type='number' ng-model='current' min='1'>
        <div class='paginate' paginate-pages='{{pages}}' current-page='current'></div>
    </div>
</div>

CSS

</style>
<link rel="stylesheet" type="text/css" href="http://flaviusmatis.github.com/simplePagination.js/simplePagination.css">

JavaScript

var app = angular.module('app', []).controller('MainCtrl', function($scope) {
    $scope.pages = 10;
    $scope.current = 5;
}).directive('paginate', function($timeout) {
    return {
        restrict: 'C',
        replace: true,
        scope: {
            pages: '@paginatePages',
            currentPage: '='
        },
        template: '<div class="pagination-holder dark-theme">' + '</div>',
        controller: function($scope, $element, $attrs) {
            var halfDisplayed = 1.5,
                displayedPages = 3,
                edges = 2;
            $scope.getInterval = function() {
                return {
                    start: Math.ceil($scope.currentPage > halfDisplayed ? Math.max(Math.min($scope.currentPage - halfDisplayed, ($scope.pages - displayedPages)), 0) : 0),
                    end: Math.ceil($scope.currentPage > halfDisplayed ? Math.min($scope.currentPage + halfDisplayed, $scope.pages) : Math.min(displayedPages, $scope.pages))
                };
            }
            $scope.selectPage = function(pageIndex) {
                $scope.currentPage = pageIndex;
                $scope.draw();
                $scope.$apply();                        
            }
            $scope.appendItem = function(pageIndex, opts) {
                var options, link;

                pageIndex = pageIndex < 0 ? 0 : (pageIndex < $scope.pages ? pageIndex : $scope.pages - 1);

                options = $.extend({
                    text: pageIndex + 1,
                    classes: ''
                }, opts || {});

                if (pageIndex == $scope.currentPage) {
                    link = $('<span class="current">' + (options.text) + '</span>');
                } else {
                    link = $('<a href="javascript:void(0)" class="page-link">' + (options.text) + '</a>');
                    link.bind('click', function() {
                        $scope.selectPage(pageIndex);
                    });
                }

                if...