AngularJs $收看$ location.search不工作時reloadOnSearch是假的路由

我routeProvider已經reloadOnSearch設置爲假：

$routeProvider 
    .when(
     "/film/list", 
     { 
      templateUrl: '/film/list.html', 
      controller: FilmListController, 
      reloadOnSearch: false 
      } 
      .... 

)

我這樣做是因爲我不在查詢字符串更改後，不希望整個控制器重新加載，但我仍然使用它，並且url看起來像這樣：film/list?sort=isbn&order=asc&offset=0。現在每當查詢字符串發生變化，我想從我的控制器調用一個函數。所以，我想建立一個$控制器看：

$scope.location = $location; 
$scope.$watch('location.search()', function(search) { 
     $scope.list(); 
});

但是，這是行不通的。如果我設置$觀看觀察查詢字符串的單個參數的變化，那麼它的工作。但我不想爲我的查詢字符串的每個參數設置$ watch。我現在使用的解決方案是這樣的：

$scope.location = $location; 
$scope.$watch('location.url()', function(url) { 
    if($location.path() == '/film/list') 
     $scope.list(); 
});

所以不是看的搜索，我看整個URL，然後我檢查的路徑是我在routeProvider設置爲有條件調用該函數的一個。我不喜歡這個解決方案是我必須明確鍵入$ location.path的值才能匹配。

任何人都可以提出一個更好的解決方案，或許解釋我爲什麼$看不工作的$ location.search（）？

來源

2013-02-26 MBozic

嘗試在函數中封裝location.search（）。請參閱http：// stackoverflow。com/questions/13465690/changing-the-class-in-angularjs-using-url-data/13468121＃13468121更多信息。 – 2013-02-26 16:46:28

做深入觀察。爲手錶添加true作爲3.參數。 – 2014-11-04 14:05:33

[AngularJS搜索更改事件]的可能重複（http://stackoverflow.com/questions/14867772/angularjs-search-change-event） – 2015-02-19 19:36:56

你可以聽在你的控制器$routeUpdate事件：

$scope.$on('$routeUpdate', function(){ 
    $scope.sort = $location.search().sort; 
    $scope.order = $location.search().order; 
    $scope.offset = $location.search().offset; 
});

來源

2013-02-26 17:52:21 Stewie

+26

只是想指出，您必須將$ reloadOnSearch設置爲false $ routeUpdate可用。我通過google找到了這個答案，並且花了很長時間才弄清楚爲什麼$ routeUpdate最初不可用。（這是在文檔中，我只是錯過了它）。 – Josh 2013-06-07 17:02:33

Stewies答案是正確的，你要聽$routeUpdate事件，由於它的效率更高。

但要回答你的手錶爲什麼不工作，當你看location.search()時，你正在觀察搜索方法返回的引用是否相同。每次調用它時它都會返回相同的對象，這就是爲什麼你的手錶沒有開火。也就是說，即使搜索參數發生變化，它仍然是返回的相同對象。爲了解決這個問題，你可以傳入true作爲第三個參數$watch。這將告訴Angular按價值進行比較，而不是參考。但是在創建這樣的手錶時要小心，因爲它們會消耗更多的內存，並且需要更長的時間來執行。所以這就是爲什麼你應該像stewie說的那樣去做。

來源

2013-02-26 19:26:18

太好了，這真是很好的解釋！如果您不介意，我會接受stewie的回答，因爲他之前發佈了答案，儘管此解釋使答案完整。 – MBozic 2013-02-26 20:53:37

建議使用$ watch（objectEquality）的第三個參數是一個很好的提示。見http://stackoverflow.com/questions/14867772/angularjs-search-change-event/14868586#14868586以及 – 2014-04-23 14:22:50

101

如果你不使用角度的路由解析，或者你只是想知道，每當$位置的變化，有一個事件只是用於這一目的

$rootScope.$on('$locationChangeSuccess', function(event){ 
     var url = $location.url(), 
      params = $location.search(); 
})

來源

2013-05-16 02:09:07

這是一個完美的答案。它解決了我的問題。是否有像$ locationChangeSuccess這樣的全局變量的列表？ – 2017-06-23 10:53:22

@RakeshBurbure你可以看看源代碼:)它可以幫助:) – 2017-06-26 10:31:09

我明白你的觀點。謝謝。 :) – 2017-06-26 12:10:26

關注在控制器上routeUpdate這樣的變化：

$scope.$watch('$routeUpdate', function(){ 
    $scope.sort = $location.search().sort; 
    $scope.order = $location.search().order; 
});

來源

2014-02-10 21:44:14 CodeOverRide

使用

$scope.$watch(function(){ return $location.search() }, function(params){ 
    console.log(params); 
});

代替。

來源

2014-12-03 14:21:11

AngularJs $收看$ location.search不工作時reloadOnSearch是假的路由

回答

相關問題