CODEWITHSUNDEEP
angularjslocal-storageangular-material
Sahesh
Sahesh

Reputation: 885

How to set local storage value to selected value in drop down Angular JS?

I'm having a Angular JS material drop down menu and items are loading from my controller. When user clicks an item , I'm storing it value to local storage. It works well. After selecting the value , I want to set that (local storage value) value as dropdown default value. 

  <div flex>
    <md-select ng-model="$callcenterController.selectedLanguage" ng-selected="$callcenterController.getLocalStorageItem" ng-change="$callcenterHomeController.languageChange($callcenterController.selectedLanguage.name)"  placeholder="{{$callcenterController.selectLanguageLabel}}" >
        <md-option ng-value="languages" ng-repeat="languages in $callcenterHomeController.languageList"></md-select-label>  {{ languages.name }}</md-option>
  </md-select>

From my controller

ctrl.getLocalStorageItem = localStorage.getItem('selectLanguage')

ctrl.languageChange = function (key) {
if (typeof this.selectedLanguage != 'undefined'){

  localStorage.setItem('selectLanguage', key);

  $route.reload();

}  }

Upvotes: 0

Views: 2097

Answers (1)

yBrodsky
yBrodsky

Reputation: 5041

You have to set the value to the variable you bind in ng-model. In your case

$callcenterController.selectedLanguage

So:

Controller:

ctrl.selectedLanguage = localStorage.getItem('selectLanguage');

ctrl.languageChange = function () {
  if(ctrl.selectedLanguage) {
    localStorage.setItem('selectLanguage', ctrl.selectedLanguage);
  }
}

View:

<md-select ng-model="$callcenterController.selectedLanguage"  ng-change="$callcenterHomeController.languageChange()" >
...etc
  </md-select>

Upvotes: 1

Related Questions