angularJS không cuộn lên trên cùng sau khi thay đổi chế độ xem

Question

Ví dụ:

Người dùng cuộn xuống trên chế độ xem A;

Sau đó, người dùng nhấp vào liên kết sẽ đưa người dùng xem B;

Chế độ xem thay đổi, nhưng vị trí dọc của người dùng vẫn giữ nguyên và phải cuộn theo cách thủ công lên đầu màn hình.

Đây có phải là lỗi góc không?

Tôi đã viết một giải pháp nhỏ sử dụng jquery để cuộn lên trên cùng; nhưng tôi không tìm thấy sự kiện chính xác để ràng buộc nó.

chỉnh sửa sau khi nhìn thấy những nhận xét:

Làm thế nào và khi nào tôi kéo bản thân mình đến đỉnh cao? Tôi đang sử dụng jquery nhưng sự kiện $ viewContentLoaded quá sớm (phương thức chạy nhưng trang không cuộn vào thời điểm đó)

Answer 1

Giải pháp là để thêm autoscroll="true" đến yếu tố ngView của bạn:

<div class="ng-view" autoscroll="true"></div> 

https://docs.angularjs.org/api/ngRoute/directive/ngView

Answer 2

Dường như bạn hiểu tại sao sự cố xảy ra dựa trên nhận xét của @ jarrodek.

Đối với một giải pháp, bạn có thể làm theo giải pháp @ TongShen của gói chức năng của bạn trong một $timeout hoặc bạn có thể thực hiện cuộc gọi hàm trong phần bạn đang tải.

<!-- New partial--> 
<div ng-init="scrollToTop()"> 

</div> 

Nếu bạn xem thay đổi được kích hoạt sau sự kiện nhấp, bạn cũng có thể thực hiện cuộc gọi hàm trên phần tử đó. Chỉ cần đi xuống đến thời gian mặc dù. Chỉ phụ thuộc vào cách mọi thứ được thiết lập.

Answer 3

Góc không tự động cuộn lên trên cùng khi tải chế độ xem mới, nó chỉ giữ vị trí cuộn hiện tại.

Đây là workaround tôi sử dụng:

myApp.run(function($rootScope, $window) { 

    $rootScope.$on('$routeChangeSuccess', function() { 

    var interval = setInterval(function(){ 
     if (document.readyState == 'complete') { 
     $window.scrollTo(0, 0); 
     clearInterval(interval); 
     } 
    }, 200); 

    }); 
}); 

Đặt nó trong bootstrap của bạn (thường được gọi là app.js).

Đó là một giải pháp javascript thuần túy (tốt hơn là không nên sử dụng jQuery nếu nó dễ dàng).

Giải thích: Tập lệnh kiểm tra mỗi 200ms nếu DOM mới được tải đầy đủ và sau đó cuộn lên đầu và dừng kiểm tra. Tôi đã thử mà không có vòng lặp 200ms này và đôi khi nó không di chuyển được vì trang này không được hiển thị hoàn toàn.