3

I am new to AngularJS, I have a dropdown and a link. When I click the link, Anagularjs will route a different view (for example, display a chart and table).

Then when I click browser's back button, the dropdown will show the default value, other than the value I selected before.

Is it possible to let AngularJS remember the selected value of my dropdown when the link is clicked when I click browser's back button?

<select ng-model="selectedManagerFilter" ng-init="selectedManagerFilter= selectedManagerFilter || '*'" 
ng-options="item.Code as item.Name for item in ManagerFilters" id="lstManagementGroup" name="lstManagementGroup"></select>
daxu
  • 3,514
  • 5
  • 38
  • 76
  • Possible duplicate: http://stackoverflow.com/questions/14824901/how-to-preserve-data-through-angularjs-routing – ilmgb Aug 06 '15 at 15:13

1 Answers1

3

Your scope will get cleared when you exit the page and recreated with the default values when you get back to it.

You have 2 options:

  1. use a Service to keep this kind of information (like selectedItem from your dropdown) and other useful things. The option selected in the dropdown should be bound to the service object:

    angular.module('shared').factory('UsefulService', function() {

var UsefulService = {};

UsefulService.myPageSettings = {
    currentDropDownItem: 1, //this is what you need
    otherSetting: "blah"
};

return UsefulService;
});

and in your controller you should bind the scope variable to it (don't forget to require the UsefulService in your controller's dependencies):

$scope.myDearSettings = UsefulService.myPageSettings;

and then access it with $scope.myDearSettings.currentDropDownItem;

  1. you can set a hash on your route when the dropdown changes (bound to the value) so when you hit Back you will get to the same state because of the hash. Basically, the url in your address bar will look like: http://your_server:your_port/myPage#Today where Today is the selected item.

The most recommended solution is option #1.

bosch
  • 1,089
  • 11
  • 16
  • do you have an example of option 1? – daxu Aug 06 '15 at 15:18
  • thanks, but how can I bind this to my modal then? At the moment, the model is selectedManagerFilter. Should I change it to – daxu Aug 06 '15 at 15:34
  • Hi, I changed it to a service, but got the same problem. What I can see is that when I hit back button, it will go back to the init setting code again and FilterSettingSvc.FilterSettings actually goes back to the default values as well. – daxu Aug 06 '15 at 16:01
  • Maybe you are setting the $scope value in the controller? This way it will always override the service setting when you get to that page. You should only rely on the data from the service. – bosch Aug 06 '15 at 16:04
  • No, can't really work this out at all. Do you have an example fiddle etc? – daxu Aug 06 '15 at 16:12
  • Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/85320/discussion-between-bosch-and-daxu). – bosch Aug 06 '15 at 16:15