remove # symbol from URL in Angular JS [duplicate]

Question

I am beginner in AngularJS and i am trying to remove # symbol from URL and i am using Visual Studio code IDE ,I did below steps for remove # from URL and when i launch Application with HTTP Live server its working and # removed from URL but when i reload page i am getting 404 can some one suggest me please

app.js

var routerApp = angular.module('routerApp', ['ui.router']);

routerApp.config(function ($stateProvider,$locationProvider,$urlRouterProvider) {

    $urlRouterProvider.otherwise('/employeeList');

    $stateProvider

        .state('home', {
            url: '/home',
            templateUrl: 'templates/home.html'
        })
       .state('employeeList', {
            url: '/employeeList',
            templateUrl: 'templates/list_of_employees.html',
            controller: 'EmployeeController'
        })
        $locationProvider.html5Mode(true).hashPrefix('')

});

index.html

<head>
  <base href='/'>
</head>

remove .hashPrefix('') Just keep $locationProvider.html5Mode(true); — subodhkalika
– subodhkalika, Commented Dec 25, 2018 at 6:52
I am using vs code I think we have to set something in web.config file but in vs code there is no web.config file — AbhiRam
– AbhiRam, Commented Dec 25, 2018 at 6:54

subodhkalika · Accepted Answer · 2018-12-25 07:00:42Z

0

Using this $locationProvider.html5Mode(true) requires URL rewriting on server side, basically you have to rewrite all your links to entry point of your application (e.g. index.html).

Assuming you are using Apache and your index file is index.php or index.html , try adding the following to your .htaccess file to create a rewrite rule.

   <IfModule mod_rewrite.c> 
      RewriteEngine On RewriteBase / RewriteCond %{REQUEST_FILENAME} !-f 
      RewriteCond %{REQUEST_FILENAME} !-d RewriteRule ^(.*) /index.php/#/$1 
   </IfModule>

answered Dec 25, 2018 at 7:00

subodhkalika

2,3151 gold badge11 silver badges20 bronze badges

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

8 Comments

AbhiRam Over a year ago

Where should I use this code?

subodhkalika Over a year ago

you need to create a .htaccess file in your project folder

AbhiRam Over a year ago

How can I create ?

AbhiRam Over a year ago

can we create this in vsCode?

subodhkalika Over a year ago

create a new file with file named .htaccess

|

Collectives™ on Stack Overflow

remove # symbol from URL in Angular JS [duplicate]

app.js

index.html

1 Answer 1

8 Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

app.js

index.html

1 Answer 1

8 Comments

Linked

Related