Implementation of Loopback Angular Routing
AngularUI Router is a routing framework which is commonly used for loopback AngularJS. The main drawback of this method is that it does not guarantee stability.
In this short blog I’m suggesting ‘ngRoute’ module that provides routing, deeplinking services and directives for angular.js apps. The ngRoute is an angular core module which is good for basic scenarios. For implementing this routing, we need to customise the built-in features of loopback angular services.
The ‘lbServices’ module provides services for interacting with the models exposed by the LoopBack server via the REST API whereas The ngResource module provides support for interaction with server side data source.
Everytime we regenerate the lbServices, we should customize it as mentioned below.
Customize lbServices.js
Create lbServices module with ngResource as dependency.
var module = angular.module("lbServices", ['ngResource']);
We are splitting the dependency and including it with a module that is created with our application (todoapp) and we use it for factory services. Replace the above line with:
var module = angular.module('todoapp');
Customize app.js
The ui-router and lb-services have included here for routing while creating module app. Remove the below line of code.
angular.module('app', [ 'lbServices', 'ui.router' ]) ;
The app is created with required dependency modules such as ngRouter, ngResource and it is included along with the created app. Replace the above line with :
var app = angular.module('todoapp', ['ngRoute', 'ngResource']);
All dependency library files are included at the index page.
To summarize, the process is tagged with advantages listed below:
1. The most basic and simple route method should include an HTML template to render, like in the process depicted here.
2. We can extend the route object to include custom data that we need
3. We can assign a controller to the view and can access route parameters by injecting services to our controller.
- Share this
