javascriptangularjsroutesanchoranchor-scroll

Adding anchor to AngularJS State

I have a state named state.home() that is used to redirect a user to the home pageand this is my state:

$stateProvider
    .state('state.home', {
        url: '/home',
        templateUrl: modulePath + '/views/home/home.html',
        controller: 'state:HomeController',
        controllerAs: 'homeCtr'
    })

In another page after doing some work , in my controller i need to redirect the user to a specific Div in the home page, so in my controller i added this line for the redirection but it doesn't seem to be the right way:

$state.go('state.home',{'#': 'anchor'});

I want to know if it could work with the same state or I have to make a new state.

Solution

  • Give the div an id, e.g <div id="anchor"></div>

    in the controller, navigate to the intended state and use anchor scroll to go to the div. Dont forget to inject $anchorScroll

    $state.go('state.home').then(function() {$anchorScroll('anchor');})