MVC Angular - Remove hash from url

Question

I've a requirement where I need to remove the # from url of angularJS application because I need to integrate with google drive api and it is not accepting the url's with #.

So, I've gone thorugh some suggestions on web here and have done some changes and removed the hash. but I'm unable to load the page after refresh.

previous url : http://localhost:54867/index.html#/Home/Chat current url : http://localhost:54867/Home/Chat

as, there is no index page defined in the new url, we're unable to load the page after refresh.

Actually I've a login page and after login I'm redirecting to the index page using

window.location.href = '../index.html';

My app.js Code

var plusapp = angular.module('plusapp', [
  'ngRoute',
  'ngAnimate',
  'ngSanitize',
  'ui.bootstrap',
  'checklist-model',
  'dx'
]).
config(['$routeProvider', '$locationProvider',
  function($routeProvider, $locationProvider) {
    $routeProvider.
    when('/Account/Login', {
      templateUrl: '/Account/Login',
      controller: 'LoginController'
    }).
    when('/Home/Chat', {
      templateUrl: '/Home/Chat',
      controller: 'ChatController'
    }).
    otherwise({
      redirectTo: '/Home/Chat'
    });

    $locationProvider.html5Mode(true);
  }
]);

and in my index page I've also place base tag this way

<head>
  <meta charset="utf-8">
  <base href="/">

My final requirement is to remove the hash and load the page even after refresh. BTW, I'm using MVC and angularJS

Can someone, please help me through this?
Do anyone got a link to a sample using mvc and angular to remove hash, where I can check and follow the steps?

Use $locationProvider.html5Mode(true); to remove the hash also refer stackoverflow.com/questions/37559271/… — Ebin Manuval
– Ebin Manuval, Commented Jun 1, 2016 at 5:20
I've already used the same code for removing hash. but may be I'm doing some other mistake. now, I need the page to load after refresh — RealSteel
– RealSteel, Commented Jun 1, 2016 at 5:23
as per the angulr Docs docs.angularjs.org/guide/$location Server side Using this mode requires URL rewriting on server side, basically you have to rewrite all your links to entry point of your application (e.g. index.html) — Ebin Manuval
– Ebin Manuval, Commented Jun 1, 2016 at 5:28
if you are using apache server, create a .htaccess file on the root of your shared Apache server. refer this link: ngmilk.rocks/2015/03/09/… — Ebin Manuval
– Ebin Manuval, Commented Jun 1, 2016 at 5:34
@ebinmanuval : I've also tried pasting this code in my web.config. but after that, my application is not even logging in stackoverflow.com/a/27011093/2027813 — RealSteel
– RealSteel, Commented Jun 1, 2016 at 5:36

mujuonly · Accepted Answer · 2016-06-01 05:23:26Z

0

Try this

$location.path('/');

instead of

window.location.href = '../index.html';

answered Jun 1, 2016 at 5:23

mujuonly

11.9k5 gold badges48 silver badges81 bronze badges

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

3 Comments

mujuonly Over a year ago

Have you passed $location to the controller. or Try this way $scope.go = function ( path ) { $location.path( path ); }; <button ng-click="go('/home')"></button>

RealSteel Over a year ago

yeah.I've added $location as dependency like this angular.module('Login', []) .controller('LoginController', ['$scope', '$location', function ($scope, $location) {

mujuonly Over a year ago

Have you tried this , $scope.go = function ( path ) { $location.path( path ); }; <button ng-click="go('/home')"></button>

Collectives™ on Stack Overflow

MVC Angular - Remove hash from url

1 Answer 1

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related