Building a Hacker News Clone in AngularJS – Part 3

tutorial

This is Part 3 of the series on Building a Hacker News Clone in AngularJS. The Project is the penultimate assignment in the Learn Verified Full Stack Web Developer Program. In this post, we’ll be focusing on implementing AngularJS Pagination. To do this, we’ll be using a library developed by Michael Bromley.

In this post we’ll cover the following tasks:

  • Using the dir-paginate directive to paginate our list of top stories
  • Using the dir-pagination-controls directive to add pagination links.
  • Displaying the proper numbers on each page

Michael Bromley’s library gives us two directives that we can use to implement AngularJS Pagination. The library itself makes it extremely easy to add pagination to your Angular app. In the following sections, you’ll see that we ran into some issues that are specific to our Hacker News Clone. After we add pagination to our app, we’ll walk through how to work with the library to address the issues that were specific to this application.