[AngularJS] angularjs 프로젝트 네임앵커(책갈피기능?) 사용하기

프로젝트중 네임앵커기능을 달아야 했다.

 

 

<div id="top"></div> <a href="#top">이동</a>

 

위 코드처럼 a태그를 클릭하면 해당 #뒤에 id값 태그로 이동하는 간단한것 이었기에 금방 하겠구나 생각했는데
동작을 하지않았다.

 

해당 프로젝트가 AngularJS를 사용중이었는데 분명 이녀석 때문일거라 생각하고
바로 구글링

 

다음과 같은 결과를 얻었다

https://docs.angularjs.org/api/ng/service/$anchorScroll

AngularJS

 

짧게 정리 해보자면

 

 

<a href="javascript:;" ng-click="clickScroll(이동할 태그 id명)">이동</a>   $scope.clickScroll = function(id) {      $location.hash(id);      $anchorScroll(); };

$location 과 $anchorScroll만 주입시켜 이용하면 끝