How to store service in "dropdown" after page refreshing using Angularjs

Question

The function i stored the dropdown selected value in service and move the value from one place to another it working fine, but what i need is after refreshing the page dropdown will change to select but i need select value must be in dropdown i am using cookie also here i attached my code help how to do this

Controller code

app.factory('StoreService', function() {
  return {
    storedObject:''
  };      
});

app.controller('UserNameShowCtrl', ['$scope', '$http', '$window', '$filter', '$cookieStore','StoreService', 
 function ($scope, $http, $window, $filter, $cookieStore,StoreService) {


$scope.FacilityDropValues=[ { value: 0, content: "First content" },
            { value: 1, content: "Second content" }]

   $scope.value=  $cookieStore.get('FacilityID');

        $scope.FacilityChange=function(){
            debugger;
                $scope.value = StoreService;
                $cookieStore.put("FacilityID", StoreService);
                 $cookieStore.put("FacilityID1", $scope.value.storedObject);

        };

html

<select id="MaterialFacility"  
     class="form-control"   
     ng-change="FacilityChange(value.storedObject)"
     ng-model="value.storedObject" >

   <option value=''>Select</option>
   <option ng-repeat="FacilityDropValue in FacilityDropValues" 
       value="{{FacilityDropValue.value}}">{{FacilityDropValue.content}}</option>                                           
</select>

Pengyy · Accepted Answer · 2017-05-15T10:34:15.943

1

you can bind ng-model of select with StoreService directly.

<select id="MaterialFacility" 
   class="form-control"   
   ng-change="FacilityChange()"
   ng-model="StoreService.storedObject" >

and store StoreService at ng-change event.

$scope.FacilityChange=function(){
  debugger;
  // $scope.value = StoreService;
  $cookieStore.put("FacilityID", StoreService);
  $cookieStore.put("FacilityID1", StoreService.storedObject);
};

Comments: $scope.value = StoreService; doesn't make any sense since you are changing $scope.value, this line will overwrite what you have selected with blank.

ADD:

when using ng-repeat at select, you have to use ng-selected="expression" to set the default selected option

<select id="MaterialFacility"  
        class="form-control"   
        ng-change="FacilityChange(value.storedObject)"
        ng-model="value.storedObject" >

  <option value=''>Select</option>
  <option ng-repeat="FacilityDropValue in FacilityDropValues" 
          ng-selected="FacilityDropValue.value === value.storedObject"
          value="{{FacilityDropValue.value}}">{{FacilityDropValue.content}}</option>                                           

</select>

NOTE: since you are saying when binding StoreService directly in template leads to blank page and no error, here you san still bind with value.storedObject.

edited May 15 '17 at 10:34

answered May 15 '17 at 09:40

Pengyy

37,383
15
83
73

same after reload reload it's come to select @Pengyy – jose May 15 '17 at 09:44
@jose what's your version of angularjs? – Pengyy May 15 '17 at 09:47
@jose see my answer of the `ADD` part. – Pengyy May 15 '17 at 09:51
but my values are stored in cookies correctly @pengyy – jose May 15 '17 at 09:52
@jose it doesn't change much, just give it a try. – Pengyy May 15 '17 at 09:53
i try my whole page will not load just blank – jose May 15 '17 at 09:56
Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/144239/discussion-between-pengyy-and-jose). – Pengyy May 15 '17 at 09:57
https://stackoverflow.com/questions/45342577/ng-change-not-trigger-in-ie-11-in-angularjs – jose Jul 27 '17 at 06:14

score 0 · Answer 2 · answered May 15 '17 at 07:13

0

Try this out. you did not update the service, storeservice

Instead of 
 $scope.value = StoreService;
Use 
StoreService.storedObject =$scope.value.storedObject

answered May 15 '17 at 07:13

Pradeep Prabhu B R

408
3
12

same yar @RandyPrad – jose May 15 '17 at 07:26
can you put the console and check what values is stroing store service – Pradeep Prabhu B R May 15 '17 at 07:30
can you check the console and what it is storing in store service – Pradeep Prabhu B R May 15 '17 at 07:32

How to store service in "dropdown" after page refreshing using Angularjs

Controller code

html

2 Answers2

Linked