Chapter 6A custom provider based on this idea will probably vary from one application to
another, so we are not providing detailed, step-by-step instructions on how to build
such a utility here. Nevertheless, the sample SCRUM application contains a custom
provider that drastically reduces the amount of code needed to define routes for
CRUD functionality. Its source code can be found on GitHub, where the whole
application is hosted but the following is an example of a custom API in use:
angular.module('admin-users', ['services.crud'])
.config(function (crudRouteProvider) {
crudRouteProvider.routesFor('Users')
.whenList({
users: function(Users) { return Users.all(); }
})
.whenNew({
user: function(Users) { return new Users(); }
})
.whenEdit({
user: function ($route, Users) {
return Users.getById($route.current.params.itemId);
}
});
})This is all that is needed to define a full set of CRUD routes for one functional area!
Summary
Effective design of navigation links within an application is paramount, as it forms
the backbone around which the whole application is wrapped. Having a solid
linking structure is important for our users, so that they can easily navigate within
a web application. But it is also important for us, the developers, as it helps us to
structure and organize code.
In this chapter we saw that applications built with AngularJS can offer an excellent
user experience, when it comes to linking and navigation, one comparable to the Web
1.0 days. In practical terms, it means that we can once again allow our users to use the
back and forward buttons in the browser to navigate through the application. On top
of this, we can display nice, bookmarkable URLs in the browser's address bar.