{{message}}

Basic Table (with hover)

Stripped Table (Condensed & with border)

Search Table

{{siteData.countryName}} {{siteData.language}}
Usage
Create a div tag in html file with specific id for example basictableArea,strippedtableArea,condensedtableArea and write a specific function in javascript file to perform your business logic. An sample example as shown below:

HTML file:
<div id="basictableArea"></div>
<div id="strippedtableArea"></div>
<div id="condensedtableArea"></div>
            <table ng-table="tableParams" class="table table-bordered table-striped customtable" show-filter="true">
                <tr ng-repeat="siteData in $data">
                    <td title="'Country'" filter="{ countryName: 'text'}" sortable="'countryName'">{ {siteData.countryName} }</td>
                      <td title="'Language'" filter="{ type: 'text'}" sortable="'type'">{ {siteData.language} }</td>
                </tr>
            </table>

Javascript file:


        var data ={"basic_table_data": {"itemHeader": ["First Name", "Last Name", "Age"],"rowitem": [{"values": ["A", "B","1"]},{"values": ["C", "D", "2"]},{"values": ["E", "F", "3"]}],"striped": false,"border": false,"hover": true,"condensed": false,"filter": false,"action": "","searchField": ""},
        "str_table_data": {"itemHeader": ["First Name","Last Name","Age"],"rowitem": [{"values": ["A","B","1"]},{"values": ["C","D","2"]},{"values": ["E","F","3"]}],"striped": true,"border": true,"hover": false,"condensed": true,"filter": false,"action": "","searchField": ""},"cond_table_data": [{
        "countryName": "China","language": "Mandrain"},{"countryName": "India","language": "English"},{"countryName": "USA","language": "English"}]};


        $scope.init = function() {
            loadTableData();
        }

         function loadTableData() {

            var table_tpl = $(modelTemplate).filter('#table').html();

            var html = Mustache.to_html(table_tpl, data.basic_table_data);
            $('#basictableArea').html(html);

            var html = Mustache.to_html(table_tpl,data.str_table_data);
            $('#strippedtableArea').html(html);

            $scope.tableParams = new NgTableParams({
                count: 5, sorting: {language: 'asc'}
            }, {counts: [5, 10, 20, 50], dataset: data.cond_table_data});
        }