AngularJs $смотреть на $location.search не работает, когда reloadOnSearch является ложным

Мой routeProvider для маршрута reloadOnSearch установлен на false:

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

  )

Я сделал это, потому что я не хочу, чтобы весь контроллер был перезагружен после изменения строки запроса, но я все еще использую его, и URL-адрес выглядит следующим образом: film/list?sort=isbn&order=asc&offset=0. Теперь, когда изменяется строка запроса, я хочу вызвать функцию из моего контроллера. Поэтому я попытался настроить $watch в контроллере:

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

Но это не работает. Если я устанавливаю $watch для просмотра изменений отдельного параметра строки запроса, то он работает. Но я не хочу устанавливать $watch для каждого параметра моей строки запроса. Теперь я использую следующее:

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

Поэтому вместо просмотра для поиска я просматриваю весь URL-адрес, а затем проверяю, является ли путь тем, который я установил в routeProvider, чтобы условно вызвать функцию. То, что мне не нравится в этом решении, заключается в том, что я должен explicilty ввести значение для $location.path для соответствия.

Может ли кто-нибудь предложить лучшее решение и, возможно, объяснить мне, почему $watch не работает для $location.search()?

Ответ 1

Вы можете прослушивать событие $routeUpdate в вашем контроллере:

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

Ответ 2

Если вы не используете разрешение Angular маршрута или просто хотите знать, когда меняется переменная $location, для этой цели есть событие

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

Ответ 3

Ответ на сообщения Stewies правильный, вы должны слушать события $routeUpdate для этого, поскольку он более эффективен.

Но ответьте, почему ваши часы не работают; когда вы смотрите location.search(), вы смотрите, является ли ссылка, возвращаемая методом поиска, одинаковой или нет. И он будет возвращать ссылку на тот же объект каждый раз, когда вы его вызываете, поэтому ваши часы не стреляют. То есть, даже если параметры поиска изменяются, это все тот же объект, который возвращается. Чтобы обойти это, вы можете передать true как третий аргумент $watch. Это скажет Angular сравнивать по значению, а не по ссылке. Но будьте осторожны при создании таких часов, потому что они будут потреблять больше памяти и занимать больше времени. Итак, почему вы должны это делать, как сказал stewie.

Ответ 4

Использование

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

вместо.

Ответ 5

Следите за изменениями на routeUpdate, как это в контроллере:

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