Md. Nazmul Hossain Bilash Md. Nazmul Hossain Bilash - 1 year ago 69
Node.js Question

Angular Routing with ngRoute doesn't work for some routes

In my single page application I have used ngRoute for angular routing. But I am facing some problems for angular routing.

configuration :

templateUrl : 'views/product/template/product.html',
controller : 'productCtrl'
templateUrl : 'views/product/template/add-product.html',
controller : 'productCtrl'

When my routing path is /product then everything is ok. But when my routing path is /product/add then it seems an error. But if "/product/add"
replace with just "/add" then that route is also ok. So I cant recognize whats the main problem on routing "/product/add".

Error :

http://localhost:3000/product/views/product/template/add-product.html 404 (Not Found)

here I have seen a problem. other route seems like :


But error route has /product after server link.

Need some clarification & solution for this problem.

Thanks in advance

Answer Source

configure the route properly with error pages. You can follow this fiddle example.


<div ng-controller="MainCtrl">
    <li><a href="/product">product</a></li>
    <li><a href="/product/add">add</a></li>
    <li><a href="/other">Other</a></li>


var app = angular.module( "myApp", [] );

app.config( function ( $routeProvider,$locationProvider ) {
    .when( '/product', { template: 'I am product root' } )
    .when( '/product/add', { template: 'Adding a product' } )
    .when( '/other', { template: 'Other pages' } )
    .otherwise( { redirectTo: '/product' } );

app.controller( 'MainCtrl', function ( $scope ) {

for more

You can use UI Router for handling parent routing properly that will give you advance nested route facilities.