CODEWITHSUNDEEP
angularjsangular-ui-router
William
William

Reputation: 502

Always showing "index.html#!" in url on angularjs routing

I am using ui-router in my angularjs app inside a website project in Visual Studio, but it only works with the route http://localhost/index.html#!/my-page, but I want the route to be only http://localhost/my-page.

Is there a way to do this?

Here is my routing code:

angular.module('nutricaoApp').config(function ($stateProvider, $urlRouterProvider, $locationProvider, $urlMatcherFactoryProvider) {
    $urlMatcherFactoryProvider.caseInsensitive(true);

    $urlRouterProvider.otherwise('cardapio-paciente');

    $stateProvider
    .state('my-page', {
        url: '/my-page',
        templateUrl: './app/components/my-page.html',
        controller: 'MyPageController'
    });

  $locationProvider.html5Mode(false);
});

Upvotes: 1

Views: 1637

Answers (1)

Gerardo Perrucci
Gerardo Perrucci

Reputation: 734

You can try:

app.config(["$locationProvider", function($locationProvider) {
  $locationProvider.html5Mode(true);
}]);

<base href="/">

How to delete '#' sign in angular-ui-router URLs

And config your .htaccess to remove index.html

RewriteEngine On
RewriteRule ^index\.html$ / [R=301,L]
RewriteRule ^(.*)/index\.html$ /$1/ [R=301,L]

Working example on codepen

https://codepen.io/centrodph/pen/gXGVvz?editors=1010

Upvotes: 3

Related Questions