Hi all,

I am building a new content section in the umbraco backoffice where I display a table which will contains some data.

To minify the rows I am implementing pagination using the umb-pagination directive.

However this doesn't work and I do not see the pagination. If I use static valus in the directive then it works.

Below you can find all the code I use to get this to work..

View

  <table class="notely-table notely-table-bordered">
           <thead>
                     <tr>
                           ....
                     </tr>
           </thead>
           <tbody>
                    <tr ng-repeat="comment in $parent.filteredComments = (comments | filterLogType: options.type | pagination: pagination)">
                             .....
                    </tr>
           </tbody>
   </table>

   <!-- Begin umb-pagination -->
   <umb-pagination page-number="pagination.current"
             total-pages="pagination.total"
             on-next="next()"
             on-prev="prev()"
             on-go-to-page="goto()">
   </umb-pagination><!-- End umb-pagination -->

Controller

    $scope.comments = [];
    $scope.filteredComments = [];

    $scope.pagination = {
        current: 1,
        limit: 10,
        total: $scope.filteredComments.length
    };

    // Load
    $scope.load = function () {
        // Get all comments
        notelyResources.getAllComments().then(function (data) {
            $scope.comments = noteCommentsBuilder.convert(data);

            $scope.loaded = true;
        });
    };

Filters

angular.module('notely.filters').filter('pagination',

    function () {
        return function (elements, pagination) {
            var filtered = [];

            if (pagination) {

                var begin, end, index;

                begin = (pagination.current - 1) * pagination.limit;
                end = begin + pagination.limit;

                angular.forEach(elements, function (element) {
                    index = elements.indexOf(element);

                    if (begin <= index && index < end)
                        filtered.push(element);
                });

            } else {
                return elements;
            }

            return filtered;
        };
    }

);

It displays the first 10 elements, even with the filterLogType so tis works fine. But rendering the pagination gives issues.

If you view the values of the pagination object I see the correct values but the pagination wouldn't render.

Is it because of the resouce I use to get the data from the API? And with the extra filter?

Any help is welcome, stuck with this for a few hours now!

/Michaël