경로 및 앵커 태그가있는 앵글 태그, 두 번째 클릭시 작동

Question

anchor 동작을 사용해야하는 간단한 메뉴를 나타내는 간단한보기가 있습니다. 같은 페이지에는 H2 개의 태그들과 id의 링크가 스크롤되어야합니다.

나는 $anchorScroll과 $location을 사용하고 있습니다.

문제 : 내가 링크를 클릭 처음으로, 내가 볼 수있는 경로가 업데이트되어, 예를 들면 :

http://localhost:60002/#!/docs/view/somedoc#someResourceId

그러나 는 경로의 SECOND 시간을 트리거 그것을 클릭하면 예상대로 작동합니다.

업데이트 :anchorScroll()은 수동으로 element.scrollIntoView(true) 같은 동작을 사용하지 않았습니다. $location.hash을 사용하지 않으면 작동하지만 앵커에 연결할 가능성이 느슨합니다.

아이디어가 있으십니까?

보기 :

<div ng-controller="DocsMenuCtrl"> 
    <ul ng-repeat="menuItem in menuItems"> 
     <li><a ng-click="foo(menuItem.resourceId)">{{menuItem.title}}</a></li> 
    </ul> 
</div> 
... 
... 
<h2 id="...">Test</h2> 
... 

CONTROLLER :

module.controller('DocsMenuCtrl', ['$scope', '$http', '$location', '$anchorScroll', 'session', function ($scope, $http, $location, $anchorScroll, session) { 
    $scope.foo = function (resourceId) { 
     $location.hash(resourceId); 

     $anchorScroll(); 
    }; 

    $http.get('/api/menu/').success(function (d) { 
     $scope.menuItems = d; 
    }).error(function() { 
     session.logger.log(arguments); 
    }); 
}]); 

ROUTEPROVIDER CONFIG 등

$locationProvider.hashPrefix('!'); 

$routeProvider 
    .when('/default', { 
     templateUrl: 'clientviews/default', 
     controller: 'DefaultCtrl' 
    }) 
    .when('/docs/view/:id', { 
     templateUrl: 'clientviews/docs', 
     controller: 'DocsCtrl' 
    }) 
    .otherwise({ 
     redirectTo: '/default' 
    }); 

Answer 1

$location은 URL을 변경하는 데 사용되는 경우에도 페이지를 다시로드하지 않습니다. "무엇을하지 않습니까?" 이 페이지의 섹션 : $location ngDoc.

Answer 2

Ganonside가 말했듯이 위치 서비스는 URL을 다시로드하지 않습니다. URL 변경이 확실하면 경로 서비스를 사용할 수 있습니다. 특히 $ route.reload()를 사용하여 라우팅을 트리거 할 수 있습니다.

Answer 3

내가 찾은 가장 좋은 방법은 여기에 있습니다 : 당신이 검색 PARAMS를 사용하지 않는 경우 https://github.com/angular/angular.js/issues/1699#issuecomment-22509845

또 다른 옵션은, 해시 또는 검색 변경 (불행하게도, 그것이에 다시로드하지 경로 제공자에게 있습니다 둘 다에 대해 하나의 옵션).

app.config(['$routeProvider', function($routeProvider) { 
    $routeProvider.when('/group/:groupName', { 
     templateUrl: '/templates/groupView.html', 
     reloadOnSearch: false 
    }).otherwise({redirectTo: '/'}); 
}]);