umbraco angular paging directive - Extending Umbraco and using the API

Go to solution

Press Ctrl / CMD + C to copy this to your clipboard.

Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at

Ismail Mayat 4511 posts 10090 karma points MVP 2x admin c-trib

Jun 19, 2017 @ 12:10

0

umbraco angular paging directive

Extending Umbraco and using the API

Umbraco 7

Guys,

I am working on a simple dashboard control which I have working looks like,

This is turning into a big list. So was wondering is there umbraco angular directive i can use to give me pagination?

Regards

Ismail

Copy Link
Marc Goodson 2141 posts 14344 karma points MVP 8x c-trib

Jun 19, 2017 @ 13:24
2
Hi Ismail

There is a an umbPagination directive that you can use in the Umbraco backoffice:
```
   <umb-pagination ng-if="vm.pagination.totalPages > 1 && !vm.dashboard.loading"
                        page-number="vm.pagination.pageNumber"
                        total-pages="vm.pagination.totalPages"
                        on-next="vm.goToPage"
                        on-prev="vm.goToPage"
                        on-go-to-page="vm.goToPage">
        </umb-pagination>
```
there is an example of wiring up, in my 'tribute' to your content review dashboard...

https://github.com/marcemarc/tooorangey.ContentReview/tree/master/PreReleaseBeta/tooorangey.ContentReview

if that helps?

regards

Marc
Copy Link
Ismail Mayat 4511 posts 10090 karma points MVP 2x admin c-trib

Jun 19, 2017 @ 15:42

102

Marc,

I got something work using https://codepen.io/lamjaguar/pen/yOrVym and it works. I wanted to avoid server side paging as this is small and the list of items it will get back will get smaller and smaller as client cleans stuff up.

Regards

Ismail

Copy Link
Marc Goodson 2141 posts 14344 karma points MVP 8x c-trib

Jun 19, 2017 @ 16:11

0

Sorry for the confusion of the example!

It just depends on how you wire the directive up... it doesn't have to be serverside implemented at all! - you just implement goToPage in your clientside code!

the main thing is it gives you the consistency of Umbraco backoffice paging interface.

Copy Link
Matt Bliss 176 posts 234 karma points c-trib

Jun 19, 2017 @ 15:51

3

Thanks Marc & Ismail,

In one discussion you've provided two useful resources for pagination in an Umbraco Angular controller one Client Side one Server Side (both of which have their advantages in different use cases)

I've bookmarked these for future reference.

High Five you Both Rock

Matt

Copy Link
is working on a reply...

Please Sign in or register to post replies