简体   繁体   中英

AngularJS - ng-repeat Showing single records Multiple Times

I am working with AngularJS. I am getting strange behavior from ng-repeat . I have a controller which returns me the data to ng-repeat such as:

.....
//My other JS Functions
.....
var app = angular.module('main', ['ngTable']).
        controller('DemoCtrl', function($scope, ngTableParams) {
            var data = [
                //data in JSON form
            ];

            $scope.tableParams = new ngTableParams({
                page: 1,            // show first page
                count: 5           // count per page
            }, {
                total:data.length,
                getData: function($defer, params) {
                    var slicedData = data.slice((params.page() - 1) * params.count(), params.page() * params.count());
                    alert(slicedData.length);
                    console.log(slicedData);
                    $defer.resolve(slicedData);
                }
            });
        })

So, now one thing to note here that I am getting expected data after slicing it that I am passing to:

$defer.resolve(slicedData);

So, no issue seems here as it passes desired data. Now, I have ng-repeat where I show data in form of tables such as:

 <table ng-table="tableParams" class="table ng-table-responsive">            

            <tr ng-repeat="d in $data">

                <td data-title="Name">
                    {{d.id}}
                </td>
                <td data-title="length">{{$data.length}}</td>
                <td data-title="Age">
                    {{d.ciscoID}}
                </td>
            </tr>
 </table>

So, here I am getting accurate length that is 5. But the number of records(rows) shown are 25(5*5) that each row is shown five times. Similarly, if I set the count to 10, then each record will be shown ten times.

I am unable to understand this scenario as

<td data-title="length">{{$data.length}}</td>

gives me the correct length then it should iterate correctly too.

PS My getData() method in the controller is called twice don't know why?

Any help/guidance regarding this will be highly appreciated. Thanks :-)

仅通过将“ JS”和“ CSS”文件替换为最新文件即可解决此问题。

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM