angularjs - AngularJS中页面刷新或移动到另一个页面后保留下拉值

标签 angularjs node.js mean-stack

让我解释一下我的情况。我的主页中有下拉列表。如果更改了下拉列表,则数据会根据下拉列表值进行更改。
如果我刷新页面或移至另一个页面,下拉列表将自动清除。

我想在刷新页面或移动到另一个页面后保留下拉列表值。

我尝试过这样的操作,但这没有帮助。

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>

Controller .js

 $scope.getFacilityID = function (data) {
     localStorage.setItem("FacilityName", data);
     var getfacility = localStorage.getItem("FacilityName");
 }

i refered this link but it is not help ful

我不知道如何保留值(value)。任何人都可以修复我吗?

最佳答案

您不能将对象放入本地存储中,您必须将字符串存储在本地存储中。

如果你愿意,你可以拥有我在这里所做的实现:How to add local storage in angular?

对于您当前的代码,您不需要使用 ng-selected。 ng-model 就足够了。

<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>

在 Angular Controller 内,您可以执行以下操作:

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);
     }

}])

关于angularjs - AngularJS中页面刷新或移动到另一个页面后保留下拉值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43631167/

相关文章:

javascript - 跨域请求的间歇性 ERR_SSL_PROTOCOL_ERROR 错误

angularjs - 从一个 Controller 访问另一个 Controller 的数据

javascript - Nodejs && JSON : select value by key

javascript - Heroku 混合内容 HTTPS/HTTP 问题

javascript - AngularJS 在指令运行之前通过 AJAX 检索数据

javascript - 如何确定 Stripe webhook 'invoice.payment_failed' 是从 Stripe 操作还是用户操作调用的?

javascript - Sequelize - 在属于多个关联的模型中使用 set、add、create 方法

javascript - 错误 : [ngModel:numfmt] Expected `1` to be a number angularjs

javascript - Angular ng-change 不调用代码。我是否使用了错误的型号

javascript - 如何使用 javascript/Angular.js 反转时间戳