How to refresh page with angular.js view?

Question

I have a homepage link that loads /register html page. But when I change css on the /register page and want to see it I have to go back to my localhost and then click the link again so the page loads again with new css. This is painfully time-consuming, is there a way to link /register with the page/route? Or at least remove /register from URL (so that localhost is only url for the whole app) so when the user refreshes the homepage welcomes him?

Homepage link:

<a href="#/register" class="button-play-g">REGISTER</a>

View gets loaded like this

app.config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) {
$routeProvider
    .when("/register", {
        templateUrl: "/register",
        controller: "registerController"
    })
    .otherwise("/");

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

@tjg184 Thanks, but thats not really the issue. All I want is not to have to go to localhost and click register link every time I change css on localhost/register page. — Dusan J.
– Dusan J., Commented Oct 9, 2014 at 20:28
Maybe you should add a new route: .when("/", { templateUrl: "/register", controller: "registerController" }) — Aidin
– Aidin, Commented Oct 9, 2014 at 22:38

Community · Accepted Answer · 2017-05-23 12:11:41Z

This is an angular mechanic and is explained more in a recent question that I answered AngularJS + UI-Router - Manually Type URLs in HTML5 Mode without HashBang

Easy work around: use localhost/#/register instead to get to the page.

Since you are using

$location.html5mode(true);

This issue is directly related to how the files are being served to the browser. Your angular app itself only has one access point and that is your index.html page. When you type into your browser localhost/register, it is looking for the register directory, not the actual angular route. Since you've enabled html5 mode, it removed the hash bangs, which looks nice, but that requires additional configuration to be able to access the views individually without them.

Additional: If you want to remove the route URLs altogether, you will need to use stateProvider instead of routeProvider

Related article regarding stateProvider: Angular ui-router: Can you change state without changing URL?

Harutyun Abgaryan · Accepted Answer · 2014-10-09 20:36:00Z

0

Set in you html

<head>
  <base href="/yor base url">
</head>

answered Oct 9, 2014 at 20:36

Harutyun Abgaryan

2,0231 gold badge14 silver badges15 bronze badges

Collectives™ on Stack Overflow

How to refresh page with angular.js view?

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related