links outside of ng-view redirect to the pages inside ng-view

Question

I am not sure how to name the question, but here is my situation

My template is like this:

├── index.html

├── ...

├── account

│ ├── index.html

│ ├── authorization

│ │ ├── login.html

│ │ ├── signup.html

│ │ └── dashboard

So the first index page is the front page, the second index page contains ng-view which is the template for the login page, signup page, and dashboard page.

I have made:

app.config(['$routeProvider', function($routeProvider) {

    $routeProvider.

        when('/login', {

            title: 'Login',

            templateUrl: 'authorization/login.html',

            controller: 'authCtrl'

        })

        .when('/signup', {

            title: 'Signup',

            templateUrl: 'authorization/signup.html',

            controller: 'authCtrl'

        })

        .when('/dashboard', {

            title: 'dashboard',

            templateUrl: 'authorization/dashboard/index.html',

            controller: 'authCtrl'

        })

        .otherwise({

            redirectTo: "/login"

        });

    }

])

.run(['$rootScope', '$location', 'apiService', function ($rootScope, $location, apiService) {...

}]);

However, I want to add two links on the first index page, one redirect to the login page and the other one to the register page. Because both of login.html and signup.html are inside ng-view, I could not use

<a href="account"></a>

, since it will only go to the login page.

I have tried:

<div class="nav_item_extra"><a class="loggedIn" href="account/authorization/login">Sign in</a></div>

<div class="nav_item_extra"><a class="loggedIn" href="account/authorization/signup.html">Register</a></div>

Neither of them works.

Could someone helps me how to make the links? Thank you

Recommended for you: Get network issues from WhatsUp Gold. Not end users.

Answer 1

You only miss '#' (hash tag on your href)

<div class="nav_item_extra"><a class="loggedIn" href="#/login">Sign in</a>
</div>
<div class="nav_item_extra"><a class="loggedIn" href="#/signup">Register</a>
</div>

links outside of ng-view redirect to the pages inside ng-view

Sign up