각도 1 - $ anchorScroll 나는이 내 HTML 요소가 URL

Question

을 변경하지 않고 :

<button class="btn" 
      type="button" 
      ng-click="$ctrl.scrollTo()"> 
    </button> 
<div id="result"> 
</div> 

내 방법 scrollTo() :

이

scrollTo() { 
    this.$location.hash('result') 
} 

이 잘 작동하지만, 내가하지 않는 솔루션을 원하는을 URL을 변경하십시오 (URL에 #result를 추가하지 마십시오). 가능한 경우 부드러운 스크롤을 추가하십시오.

내가 만든 해결책에 가까운 해결책이 있습니까?

Answer 1

$ anchorScroll 페이지의 이름이 anchor 또는 id으로 스크롤되면 항상 URL이 변경된다는 것을 알고 있습니다. 그러나이 문제에 대한 다양한 해결책이 있습니다.

한 예 - 네이티브 scrollIntoView을 사용할 수 있습니다 (호환성을 확인하지만, 모든 괜찮은 브라우저에서 작동도 IE8) :

https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollIntoView

그래서 당신은 부드러운 스크롤 효과를 얻기 위해 이런 짓을 할 것이다 :

// play around with options if you want - you can put block: "start" which doesn't play very nice with jsfiddle but should work fine on any machine. 
    $window.document.getElementById(id).scrollIntoView({behavior: "smooth", block: "end"}); 

나는 당신을 위해 간단한 예를 준비했습니다 :

https://jsfiddle.net/pegla/eoa8v03y/4/