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

Question

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);
});

Gerardo Perrucci · Accepted Answer · 2017-11-16 17:30:21Z

3

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

edited Nov 16, 2017 at 17:30

answered Nov 7, 2017 at 17:08

Gerardo Perrucci

7347 silver badges13 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

William Over a year ago

It works when I am routing on angularjs, but when I enter the url manually on the browser, it doesn't works.

Gerardo Perrucci Over a year ago

I thinks you can fix that with a .htaccess rule

William Over a year ago

At now, I am not doing any back-end on my application, this rule could be applied to that case?

Gerardo Perrucci Over a year ago

Yes you can upload your .htaccess file on your root folder. The .htaccess rules will apply to the all site.

William Over a year ago

But I've been thinking, will angular always make my url look like "www.mysite.com/index.html/my-page.html" by default?

|

Collectives™ on Stack Overflow

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

1 Answer 1

6 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

6 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related