CODEWITHSUNDEEP
javascriptangularjsangular-ui-router
Nasuh
Nasuh

Reputation: 355

ui-router back to home page button

I am try to build website with AngularJS and I am using Ui-router extension for this. What I want to ask is how should I configure "Home Page" button?

Html: 

<body>   
    <a href="#">Home Page</a>
<div ui-view>
<div>

    <a ui-sref="A">State A</a>
    <a ui-sref="B">State B</a>

</div>
</div>

Javascript: No state for index.html. Is it necassary?

.$state('A', {
        url:"/A",
        templateUrl:"A.html",
        controller:"aController"
})
.$state('B', {
        url:"/B",
        templateUrl:"B.html",
        controller:"bController"
})

Upvotes: 1

Views: 246

Answers (2)

stuisme
stuisme

Reputation: 419

you will need to create a default route

// For any unmatched url, redirect to / (aka default)
$urlRouterProvider.otherwise("/");

// other routes
....
.$state('default', {
    url:"/",
    templateUrl:"default.html",
    controller: ""
})

Based on your html once UI-router replace what's inside the UI view, the 2 links will be gone, You will need a template with those links it it.

index.html

<body>   
    <a href="#">Home Page</a>
<div ui-view> <!-- The contents of this div are replaced with the states template -->
</div>
</body>

default.html

<div>
   <a ui-sref="A">State A</a>
   <a ui-sref="B">State B</a>
</div>

Upvotes: 2

Norbert Huurnink
Norbert Huurnink

Reputation: 1316

I would create a home state and use a similar approach as with a and b

Upvotes: 0

Related Questions