Angular linking with routing and ng-switch

Question

I have routing set up to direct the user to various pages. Pretty standard stuff. On one of those pages however, I use ng-switch to show/hide 5 different sections. What I am looking to do, and I cant seem to find any info on it, Is I want to link to 1 of those 5 sections from a different page. Very similar to anchor tags in html.

So the question is, if i use routing from one page to another, how do i route to a specific section of that page?

score 0 · Accepted Answer · edited May 23 '17 at 12:16

0

In short, you can't with ngRouter.

You can with ui-Router.

This SO question lists the main differences between ngRouter and ui-Router : AngularJS : Difference between angular-route and angular-ui-router

edited May 23 '17 at 12:16

Community

1
1

answered Oct 19 '16 at 08:42

toadflakz

7,764
1
27
40

score 0 · Answer 2 · answered Oct 19 '16 at 08:44

If you want to navigate to different pages in your application, but you also want the application to be a SPA (Single Page Application), with no page reloading, you can use the ngRoute module.

The ngRoute module routes your application to different pages without reloading the entire application.

<body ng-app="myApp">

<p><a href="#/">Main</a></p>

<a href="#red">Red</a>
<a href="#green">Green</a>
<a href="#blue">Blue</a>

<div ng-view></div>

<script>
var app = angular.module("myApp", ["ngRoute"]);
app.config(function($routeProvider) {
    $routeProvider
    .when("/", {
        templateUrl : "main.htm"
    })
    .when("/red", {
        templateUrl : "red.htm"
    })
    .when("/green", {
        templateUrl : "green.htm"
    })
    .when("/blue", {
        templateUrl : "blue.htm"
    });
});
</script

Angular linking with routing and ng-switch

2 Answers2