JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://code.angularjs.org/1.0.0rc5/angular-1.0.0rc5.min.js"></script>
<script src="http://code.angularjs.org/1.0.0rc5/angular-resource-1.0.0rc5.min.js"></script>
<div ng-app id='container' ng-controller="OrgDirectoryCtrl">
    <div class='directory_results'>
        {{orgResult.text_results}}
    </div>
    <div class='directoryResults org_directory'>
        <table class='directory_list admin_members_list'>
        <thead>
            {{orgResult.print_sponsor}}
            <th class='list_name'>{{orgResult.text_name}}</th>
            <th class='list_company'>{{orgResult.text_city}}</th>
            <th class='list_company'>{{orgResult.text_region}}</th>
            {{orgResult.print_actions}}
        </thead>
        <tbody>
            <tr class='directory_item member_single odd' ng-repeat='org in orgResult.results'>
                <td class='list_name'><a href='/organizations/profile/view/id/{{org.id}}'>{{org.name}}</a></td>
                <td class='list_company'>{{org.city}}</td>
                <td class='list_company'>{{org.state}}</td>
            </tr>
        </tbody>
        </table>
        <div class='paginator' ng-bind-html-unsafe="orgResult.paginator"></div>
    </div>
</div>

CSS

body { padding: 10px; }
#container .paginator ul li.inactive,
#container .paginator ul li.inactive:hover {
    background-color:#ededed;
    color:#bababa;
    border:1px solid #bababa;
    cursor: default;
}
#container .paginator {
    width: 800px;
    height: 25px;
    margin-top:15px;border-top:solid 1pt #eee;padding-top:5px;
}
#container .paginator ul li {
    list-style: none;
    float: left;
    border: 1px solid #006699;
    padding: 2px 6px 2px 6px;
    margin: 0 3px 0 3px;
    font-family: arial;
    font-size: 14px;
    color: #006699;
    font-weight: bold;
    background-color: #f2f2f2;
}
#container .paginator ul li:hover {
    color: #fff;
    background-color: #006699;
    cursor: pointer;
}
#container .paginator ul li.current {
    color:#fff;
    background-color:#006699;
}

JavaScript

function OrgDirectoryCtrl($scope) {
//    $scope.organizations = $resource('/organizations/index/:action',
//        {action:'getng'}
//    );
    
    // $scope.orgResult = $scope.organizations.get();
    $scope.orgResult = 
        {
            "total":"75",
            "results":
            {
                "410115":
                {
                    "id":"410115",
                    "is_sponsor":false,
                    "name":"Some company",
                    "city":"Denver",
                    "state":"CO",
                    "address_city":"",
                    "address_region":""
                },
                "270032":
                {
                    "id":"270032",
                    "is_sponsor":false,
                    "name":"Other company",
                    "city":"Alexandria",
                    "state":"VA",
                    "address_city":"",
                    "address_region":""
                }
            },
            "text_view_org":"view organization",
            "text_view_members":"view members",
            "text_sponsor":"sponsors",
            "text_name":"name",
            "text_city":"city",
            "text_region":"region",
            "text_actions":"actions",
            "text_results":"75 results found",
            "paginator":"\n<ul>\n<li class='current'>1<\/li>\n        <li class='active' q='p=2&'>2<\/li>\n        <li class='active' q='p=3&'>3<\/li>\n        <li class='active' q='p=4&'>4<\/li>\n        <li class='active' q='p=5&'>5<\/li>\n        <li class='active' q='p=6&'>6<\/li>\n        <li class='active' q='p=7&'>7<\/li>\n        <li class='active' q='p=8&'>8<\/li>\n    <\/ul>\n    <span>1-10 of 71 results<\/span>\n",
            "print_sponsor":"",
            "print_actions":""
        };
}