如何在 AngularJs 中存储和读取会话(值)?

2024-03-08

我在存储和读取会话数据时遇到问题Angularjs。 单击按钮后 emp_name 应存储在session以及我如何读取存储的 emp_namesession .

plnkr 中的示例 http://plnkr.co/edit/aX8A6b91obPO4aAr1XAF?p=preview

// Code goes here

var app = angular.module('app', []);

app.controller('Ctrl', function($scope) {
  $scope.employee = [{
      emp_id: 1,
      emp_name: 'Jes',
      emp_cont:9876543445
    }, {
      emp_id: 2,
      emp_name: 'Sandy',
      emp_cont:3553454345
    }, {
      emp_id: 3,
      emp_name: 'Alex',
      emp_cont:9343434345
    }, {
      emp_id: 4,
      emp_name: 'Nancy',
      emp_cont:9876543445
    }, {
      emp_id: 5,
      emp_name: 'Scott',
      emp_cont:9834564455
    }
  ];
  
          $scope.returnRefId = function (emp) {           
            try {
                  //  test emp
                  alert(emp);
                  // session code here
                  
            }
            catch (e) {
                  alert("some errror");
            }
        };
});
ul li{list-style:none;float:left;padding:10px;border:1px solid #ddd;height:20px;width:100px}
ul{clear:both}
label{color:red}
<!DOCTYPE html>
<html>

<head>
  <script data-require="angular.js@*" data-semver="1.3.0-beta.5" src="https://code.angularjs.org/1.3.0-beta.5/angular.js"></script>
  <link rel="stylesheet" href="style.css" />
  <script src="script.js"></script>
</head>

<body ng-app="app" ng-controller="Ctrl">
  <ul ng-repeat="employees in employee | filter:customFilter">
    <li>{{employees.emp_id}} </li>
    <li>{{employees.emp_name}} </li>
    <li>{{employees.emp_cont}} </li>
    <li><button   ng-click="returnRefId(employees.emp_name);" >Add Session</button></li>    
  </ul>
  <br /><br /><br />
  <label id="read_ses">How to store and read emp_name thru only session</label>
</body>

</html>

我已经使用 emp_name 创建了点击警报angularjs。我希望按钮单击 emp_name 应该存储在session并为session测试目的读取页面上某处的会话 emp_name 数据。

真诚感谢任何和所有的帮助/建议。 谢谢。


您的会话存储代码可能类似于使用 Javascript API 进行会话存储。您必须序列化 Javascript 对象,因为会话存储仅支持字符串。

$scope.returnRefId = function (emp) {           
        try {
              //  test emp
              alert(emp);
              // session code here
              sessionStorage.setItem("emp-key", JSON.stringify(emp));
        }
        catch (e) {
              alert("some errror");
        }
 };

或者,您可以存储每个属性emp在单独的存储密钥中。调试应该像这样简单

sessionStorage.getItem("emp-key")

有关会话存储的更多信息可以在此处找到。https://developer.mozilla.org/en/docs/Web/API/Window/sessionStorage https://developer.mozilla.org/en/docs/Web/API/Window/sessionStorage

还可以查看 ngStoragehttps://github.com/gsklee/ngStorage https://github.com/gsklee/ngStorage

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何在 AngularJs 中存储和读取会话(值)? 的相关文章

  • 单击传单形状时如何获取它的图层类型?

    我的 Leaflet 项目允许用户绘制形状 线条 矩形和多边形 用户可以单击形状来获取其统计数据 面积 周长等 我在我的FeatureGroup 上尝试了一个点击事件 其中添加了我绘制的所有形状 我不确定这是否是最好的方法 然后单击后 将调
  • 使用 ReactJS 突出显示文本

    我试图突出显示与查询匹配的文本 但我不知道如何让标签显示为 HTML 而不是文本 var Component React createClass highlightQuery function name query var regex ne
  • Javascript dispatchEvent click 在 IE9 和 IE10 中不起作用

    我正在尝试在 ExtJs 中构建应用程序时模拟鼠标事件 例如单击 鼠标悬停等 我使用下面的代码来模拟点击 function triggerEvent element eventName if document createEvent var
  • jquery如何获取右、左、上、下箭头键值

    我使用了下面的代码 每当单击箭头键 左 右 上 下 时 我得到的键值为 0 任何人都可以帮忙解决这个问题吗 document keypress function e alert key value e which 如何获取 上 下 右 左
  • scrollTop 在 Chrome 中不起作用,建议的解决方法也不起作用

    许多其他问题 here https stackoverflow com questions 2544979 is there a problem with scrolltop in chrome here https stackoverfl
  • 隐藏加载失败的图片

    我有一个 Android 应用程序 它生成一些在本地 Webkit 视图中呈现的 HTML HTML 生成的细节实际上并不那么重要 除了 大部分来自一个地方 我无法改变它 HTML 周围的模板 包括页眉 页脚 HEAD 等 CSS 和 Ja
  • 如何向 DOM 添加支持 Angular 的元素?

    我想以编程方式添加一些支持 Angular 的 DOM 元素 实际上 我可能需要添加自定义组件 我该怎么做 这是一个简单的小提琴来演示这个问题 http jsfiddle net ZJSz4 2 http jsfiddle net ZJSz
  • 如何防止字段的角度自动修剪?

    有没有什么方法可以防止整个应用程序中字段的角度自动修剪 我知道我可以使用 ngTrim 指令防止指定字段出现这种情况 但将此指令添加到应用程序中的所有文本字段看起来不太好 有什么方法可以对 Angular 模块中的所有字段执行此操作吗 这是
  • 创建一个通用函数以将其用于其他数据

    我正在制作一个项目列表 并希望随着数量变化计算其值 但如何使该函数通用以便我可以将它用于所有行 你能建议一些最好和简单的方法 但请记住我想这样做仅限 JavaScript table thead tr th Name th th Quant
  • Javascript 搜索并替换包含方括号的字符序列

    我正在尝试在字符串 Nationality EN ESP 中搜索 EN 我想从字符串中删除它 所以我使用替换方法 代码示例如下 var str Nationality EN ESP var find EN var regex new Reg
  • 在 JQueryUI 小部件的 QUnit 测试中测试可见性

    这对于其他人来说可能是显而易见的 但我没有通过搜索找到它 所以在这里发布问题和一个可能的答案 背景 使用自定义 JQuery UI 小部件小部件工厂 http jqueryui com widget 在小部件中 某些元素根据其他数据 选项隐
  • 如何通过 Web-Workers 传递自定义类实例?

    由于 Web Worker JSON 在线程之间序列化数据 因此这样的方法不起作用 worker js function Animal Animal prototype foobar function self onmessage func
  • Svg 点击事件无法正常工作

    我试图让我的 SVG 看起来像一个 饼形 看起来一切都很好 此外 我希望它们每个都有不同的点击事件 function one alert 1 function two alert 2 function three alert 3 funct
  • 时间序列折线图与轴不同步

    本实验基于这个d3官方例子 http bost ocks org mike path 我想要实现的是可视化时间序列数据的最后 x 分钟 我有这个代码的副本jsfiddle http jsfiddle net 225dC 3 单击以添加新数据
  • 如何使用 JavaScript 使 DIV 可见和不可见?

    你能做类似的事情吗 function showDiv DIV visible true or something 如果 DIV 是一个元素那么 DIV style visibility visible OR DIV style visibi
  • Vue js - 在同一级别的两个组件内传递数据

    我有需要从一个传递的数据component1到另一个component2 我不使用vuex or router 组件树 Parent Component1 Component2 从一开始component1我发出 ajax 请求 检索信息并
  • codemirror - 在编辑器内检测并创建链接

    我正在使用 codemirror 配置为显示 javascript 我有这样的代码 var ref http www example com test html var ref2 http www example com test2 htm
  • JSON 数据的动态表单(不同类型)

    我尝试使用 JSON 中的数据在 AngularJS 中创建动态表单 我有这个工作 HTML p p
  • 使用与 eval 相反的括号表示法

    我有以下内容 var module function console log module ran var someString module string TypeError object is not a function eval s
  • Google Maps JavaScript API v3 方向功能

    我使用 Google Maps js API v3 我可以根据路径点显示方向this http code google com intl hu apis maps documentation directions Waypoints 我想要

随机推荐