Wie kann man Änderungen in der URL beobachten und sie in einem Modell anwenden und umgekehrt in angularjs 1.2.29?

Question

Ich verwende ui.router, um zwischen den Zuständen zu wechseln. Einer dieser Zustände hat eine Sidebar mit einem filter Modell:

$scope.filter = { 
    searchType: 'RENT', 
    propertyType: 'APARTMENT', 
    min: 0, 
    max: 200000 
}; 

Also meine URL sieht wie folgt aus: #/search?searchType=RENT&propertyType=APARTMENT&min=0&max=200000.

Wie "synchronisieren" Sie die URL und das Modell?

Also, wenn jemand ändert, sagen wir min Wert in der URL, würde die Änderung in meinem Modell (und natürlich in einer Ansicht) reflektiert werden. Und wenn jemand einen Wert in der Ansicht ändert, ändert sich auch die URL.

---

Es versucht $scope.$watchCollection auf filter zu verwenden und $locationChangeSuccess Ereignis mit $scope.$on zu fangen, aber es hat nicht funktioniert, wie ich erwartet hatte.

Answer 1

$scope.$on('$stateChangeSuccess', function() { 
    // Grab values using $location.search() 
}); 

Wenn dieses Ereignis nicht das tut, was Sie wollen, möchten Sie vielleicht $ routeChangeSuccess.