Angular ui-router在滾動時改變狀態

Question

這是一個示例布局。 假設截面高度大於或等於用戶的視口。

+----------+
| Section1 |
+----------+
| Section2 |
+----------+
| Section3 |
+----------+

所有這些部分都放在一個視圖中。 我想在用戶滾動頁面時動態更改瀏覽器URL並到達其中一個部分：首次用戶看到http://example.com/#/section1 （角度不使用html5模式），然后他向下滾動頁面，應該當section2元素在用戶的視口中變得可見時，請參閱http://example.com/#/section2 。 此外，如果用戶復制鏈接，當他打開即http://example.com/#/section2我需要滾動頁面到該部分。

為了檢測用戶當前查看了哪個部分，我使用angular-inview指令。

現在我通過參數完成了它：

$state.go($state.current, {
    section: $scope.activeSectionId // e.g. 'section2'
}, {
    notify: false, // do not reload page
    location: 'replace' // do not save as new history entry
});

但這種方式並不安靜，網址也不友好。 此外它有一個錯誤，當我點擊鏈接與ui-sref時，第一次頁面跳轉，更改inview部分一段時間並觸發上面提到的代碼，所以實際上它不根據ui-sref導航。 但是下次我點擊 - 一切運行良好（這在頁面重新加載后發生）。

如果有可能，有人可以建議如何做得更好嗎？

Answer 1

當你$ state.go（$ state.current）時，你為什么要改變狀態？ 也許使用anchorScroll，不確定html5。

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

編輯：

對不起，我錯過了鼠標滾動。 檢查此答案https://stackoverflow.com/a/14717011/1603188並使用$ location.hash（id）;