如何禁用AngularJS中的後退和前進導航

我正在使用Angular.JS中的內置路由器在控件/模板對之間切換。在切換頁面時，地址欄會相應地改變。我檢查了文檔，它說AngularJs已經將$ location服務與瀏覽器地址欄同步了。如何禁用AngularJS中的後退和前進導航

我的問題是我真的想禁用來回在我的網頁。這是因爲通過來回點擊，我無法獲取數據來填充頁面。以前使用JQuery mobile時，我禁用了地址欄中的URL更改。通過這種方式，我基本上已經禁止了來回。但是，對於AngularJS，有沒有辦法做到這一點？

來源

2014-01-21 Fiona

否。網絡應用程序的用戶很自然地使用後退和前進按鈕進行導航。在純粹的jQuery應用程序中，人們使用各種jQuery插件來啓用瀏覽器歷史記錄，因爲默認情況下，jQuery不會做任何事情來支持瀏覽器歷史記錄。因此，angularJS維護瀏覽器歷史記錄。

當用戶使用後退和前進按鈕進行導航時，您可以向URL中添加參數以填充數據。沒有更好的方法來支持導航的後退和前進按鈕。

來源

2014-01-21 10:03:16 RaviH

我已經找出了我自己的問題。要停止來回切換的頁面切換，一種方法是監聽$ locationChangeStart事件。如果您能夠通過來回按鈕觸發它，請通過調用event.preventDefault（）;來禁用頁面更改。

只要如何判斷頁面更改是由歷史記錄按鈕還是由您的邏輯觸發的，因爲在我的主要服務中，我有控制頁面更改的邏輯。因此，這對我來說不是問題。

來源

2014-01-22 08:21:12 Fiona

以及如何是你能夠確定的變化，因爲導航按鈕的發生？ –

使用UI路由器模塊：

要禁用後退按鈕：

$rootScope.$on('$stateChangeStart', 
function(event, toState, toParams, fromState, fromParams){ 
    event.preventDefault(); 
    window.history.forward(); 
});

來源

2015-10-16 10:02:18 sathishkumar

var allowNav = false; 
var checkNav = false; 

$rootScope.$on('$stateChangeSuccess', function (event, toState, toStateParams, fromState, fromStateParams) { 

      allowNav = checkNav; 
      checkNav = true; 

     }); 

$rootScope.$on('$locationChangeStart', function (event, next, current) { 
      // Prevent the browser default action (Going back) 
      if (checkNav) { 
       if (!allowNav) { 
        event.preventDefault(); 
       } 
       else { 
        allowNav = false; 
       } 
      } 
     });

來源

2017-04-11 09:45:44

如何禁用AngularJS中的後退和前進導航

回答

相關問題