déjame explicarte mi escenario. Tengo la lista desplegable en mi página maestra. si se cambia la lista desplegable, los datos se cambian según el valor de la lista desplegable.
Si actualicé mi página o me mudé a otra página, la lista desplegable se borrará automáticamente.
Quiero conservar el valor de la lista desplegable después de actualizar la página o moverme a otra página.
Lo intenté así, pero esto no es útil.
HTML
<select id="Facility_ID" required typeof="text" name="Facility Name" ng-options="Role.FacilityName for Role in Roles" form="DistanceMatrixFormId" class="form-control" ng-model="Role._id" ng-selected="getFacilityID(Role._id.FacilityName)"> </select>
Controlador.js
$scope.getFacilityID = function (data) { localStorage.setItem("FacilityName", data); var getfacility = localStorage.getItem("FacilityName"); }
Remití este enlace pero no es útil.
No sé cómo mantener el valor. alguien me puede arreglar
No puede poner un objeto en el almacenamiento local, debe almacenar cadenas dentro del almacenamiento local.
Si lo desea, puede tener una implementación que hice aquí: ¿Cómo agregar almacenamiento local en angular?
Para su código actual, no necesita usar ng-selected. ng-modelo es suficiente.
<select id="Facility_ID" required typeof="text" name="Facility Name" ng-options="Role.FacilityName for Role in Roles" form="DistanceMatrixFormId" class="form-control" ng-model="Role._id" ng-change="updateLocalStorage()"> </select>
Y dentro de su controlador angular, lo que puede hacer es lo siguiente:
myApp.controller('controllerName', ['$scope', 'LocalStorageService', function($scope, LocalStorageService){ // After initialization of your "Role" object $scope.Role._id = LocalStorageService.retrieve('mySelectValue'); $scope.updateLocalStorage = function(){ LocalStorageService.store('mySelectValue', $scope.Role._id); } }])
Aquí hay un ejemplo que usa un servicio para almacenar el valor seleccionado. Desafortunadamente, la demostración integrada no funciona debido al espacio aislado, pero funciona cuando se sirve como una aplicación.
angular.module( "App", [] ).factory("MyStorage", function() { const key = "selected"; return { getValue: function() { const stored = localStorage.getItem(key); return stored ? JSON.parse(stored) : null; }, setValue: function(value) { localStorage.setItem(key, JSON.stringify(value)); } }; }).controller("MyCtrl", function($scope, MyStorage) { $scope.options = ["A", "B", "C"]; $scope.selected = MyStorage.getValue(); $scope.$watch("selected", newValue => { MyStorage.setValue(newValue); }); });
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.1/angular.min.js"></script> <div ng-app="App" ng-controller="MyCtrl"> <select ng-model="selected" ng-options="x for x in options"> </select> </div>