seo Question posted in
Some basic information to get you started with this can be found here.

Custom angularjs route url – SEO

Currently I’m using Angular Js routing this way and it’s working fine.

config(["$routeProvider", function ($routeProvider, $mdThemingProvider) {
        $routeProvider
            .when('/', {
                templateUrl: '/templates/home.html',
                controller: 'smu72Controller'
            })
       .when('/contact', {
           templateUrl: '/templates/contact.html',
           controller: 'smu72Controller'
       })
            .when('/objects', {
                templateUrl: '/templates/objects.html',
                controller: 'smu72Controller'
            })
            .when('/objects/:objectId', {
                templateUrl: '/templates/object.html',
                controller: 'smu72Controller'
            })
            .when('/services', {
                templateUrl: '/templates/services.html',
                controller: 'smu72Controller'
            })
        .otherwise({
            redirectTo: "/"
        });
    }
    ]);

But with this code I got ugly looking and not seo friendly urls as host/index.html#sectionname, how should I change this to get route url as host/sectionname?

P.S. I’m getting templates to div with ng-view on Index.html page.

Tags:

2

Answers


  1. 0

    by using the $locationProvider module and setting html5Mode to true (the use of HTML5 History API) we get rid of the ugly #

    config(function($routeProvider, $locationProvider) {
    $routeProvider
            .when('/', {
                 templateUrl: '/templates/home.html',
                 controller: 'smu72Controller'
             })
    /* your all other route specifications */

    $locationProvider.html5Mode(true);
}
    Login or Signup to reply.
  2. 0

    By default Angular uses something called hashbang mode, you can turn this off and use HTML5 mode – with this you get nice urls – but it won’t work in old browsers. To turn this on, put the line below in the config section of your app – remeber to inject $locationProvider.

    $locationProvider.html5Mode(true);

    Read more here https://docs.angularjs.org/guide/$location .

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search