0

In my angular app, I want to move to another html page after click on buton but it cannot move to the html page that i expected, I configed in route like that:

angular.module("abc", ["ngRoute"])
        .config(function ($routeProvider) {   
            $routeProvider.when("/checkout", {
                templateUrl: "/checkoutPage.html"
            });           
        });

In page html :

<a href="#/checkout" class="btn btn-default navbar-btn">Checkout</a>

After I hit on checkout button the link address show like this: http://localhost:12312/Index.html#!#%2Fcheckout

Thanks for your help.

Amit
  • 25,499
  • 6
  • 44
  • 72
Jane2
  • 67
  • 7
  • 1
    AFAIK your href should be like `checkout ` meaing it hsould not have hash.Also add `$locationProvider.html5Mode(true);` to config. – Navoneel Talukdar Dec 22 '16 at 07:18
  • @Marc **html5mode** requires some serverside setting in config file of a particular server. One other thing is that it will be broken if user refreshes the page if server handling is not done. – Jai Dec 22 '16 at 07:24

3 Answers3

1

Change your href url from <a href="#/checkout"> to <a href="#!/checkout"> Hope this will solve your issue.

Look here for more details.

Community
  • 1
  • 1
Nitheesh
  • 17,055
  • 2
  • 18
  • 45
0

Don't use hash in href.

<a href="checkout">checkout</a>

Aside from that better to include otherwise in routeconfiig.

angular.module("abc", ["ngRoute"])
        .config(function ($routeProvider) {   
            $routeProvider.when("/checkout", {
                templateUrl: "/checkoutPage.html",
                controller: "..."
            })
            .otherwise("/");
            $locationProvider.html5Mode(true);           
        });
Navoneel Talukdar
  • 3,964
  • 4
  • 19
  • 39
0

Its reading the state not the href tag so don't need to use hash tag for that.

<a href="/checkout" class="btn btn-default navbar-btn">Checkout</a>
Ahmer Khan
  • 727
  • 1
  • 8
  • 30