在 AngularJS 中的页面之间共享数据返回空

2023-12-05

通常,我编写 SPA,并且通过服务在控制器之间共享数据很简单。

我没有使用 SPA 格式(没有使用 ng-view),并尝试在页面之间共享数据,但在加载第二个页面(以获取数据)时它是空的。

第 1 页(索引.html):

<div ng-controller="CreateList">
    <input type="text" ng-model="myValue">
    <div ng-click="share(myValue)">Share</div>
</div>

PAGE2:

<div ng-controller="GeList">
    <p>{{ sharedData  }}</p>
</div>

JS:

app.controller('CreateList', function($scope, $location, $http, serviceShareData) {

    $scope.share= function (selectedValue) {

        if (selectedValue === undefined ) {
            console.log ("its undefined");
        }       
        else {
            console.log (selectedValue);

            serviceShareData.addData(selectedValue);
            window.location.href = "PAGE2.html";
        }
    }

});


app.controller('GeList', function($scope, $location, $http, serviceShareData) { 

    $scope.sharedData = serviceShareData.getData();

    console.log($scope.sharedData);

});

app.service('serviceShareData', function() {
    var myData = [];

    var addData = function(newObj) {
        myData.push(newObj);
    }

    var getData = function(){
        return myData;
    }

    return {
        addData: addData,
        getData: getData
    };
});

这是一个笨蛋:http://plnkr.co/edit/6VHJhirnHZxBpKOvqzI6?p=preview


有多种方法可以在页面之间共享数据 - 本地存储、会话存储、indexedDB、cookie,甚至可以将数据作为参数传递,如下所示:

window.location.href = 'page2.html?val=' + selectedValue;

以下是使用 sessionStorage 时您的服务的外观的快速示例:

app.service('serviceShareData', function($window) {
    var KEY = 'App.SelectedValue';

    var addData = function(newObj) {
        var mydata = $window.sessionStorage.getItem(KEY);
        if (mydata) {
            mydata = JSON.parse(mydata);
        } else {
            mydata = [];
        }
        mydata.push(newObj);
        $window.sessionStorage.setItem(KEY, JSON.stringify(mydata));
    };

    var getData = function(){
        var mydata = $window.sessionStorage.getItem(KEY);
        if (mydata) {
            mydata = JSON.parse(mydata);
        }
        return myData || [];
    };

    return {
        addData: addData,
        getData: getData
    };
});

笨蛋是here.

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

在 AngularJS 中的页面之间共享数据返回空 的相关文章

  • 显示具有多个父代的 D3 树

    我目前有this http bl ocks org mbostock 4339083图已实现 我希望在描述具有多个父节点的子节点时保持结构和可折叠性 有没有办法做到这一点 我研究了力图 但我也想保留一组层次结构 这意味着 1 级的父级可以有
  • 在 Internet Explorer 中使用什么来监视 jscript 内存使用情况

    我们正在调试 GWT 应用程序 在 Firefox 中运行正常 在 IE6 0 中开始运行正常 但一段时间后 它就会崩溃并开始爬行 经过一些测试后 我们怀疑存在一些内存问题 使用了太多内存 内存泄漏等 除了使用taskmanager和pro
  • 位置特征检测:固定

    我正在尝试找到一个脚本来检测设备是否放置position fixed元素相对于视口而不是整个文档 目前 标准桌面浏览器和 Mobile Safari 适用于 iOS 5 都是这样做的 而 Android 设备则相对于整个文档放置固定元素 我
  • 如何正确清理来自 AngularJS 控制器的无效输入的表单?

    我有一个 AngularJS 表单 其中包含 除其他字段之外 类型之一url 后者很重要 因为这会强制相应的输入成为有效的 URL 在某些条件下 例如 要关闭具有此类表单的模式对话框 我想以编程方式清除该表单 为此 我实现了方法reset基
  • 使用 Angular 指令禁用文本选择

    我正在学习 JavaScript 和 AngularJS 我想使用 Angular Directive 禁用文本选择 我有该函数的 JavaScript 代码 function clearSelection if document sele
  • .push() 将多个对象放入 JavaScript 数组中返回“未定义”

    当我将项目添加到beats数组然后console log用户时 我得到了数组中正确的项目数 但是当我检查 length 时 我总是得到 1 尝试调用索引总是会给我 未定义 如下所示 Tom beats 1 我想我错过了一些明显的东西 但这让
  • 如何使用有角度的材料创建卡片网格?

    我正在尝试使用 ng repeat 创建每行三张卡片的网格 我有一个普通的 javascript 对象数组附加到范围 下面的代码将为每张卡创建一个新行 div div
  • 如何使用javascript确保元素仅在圆上朝一个方向移动?

    好吧 我承认我对三角学真的很糟糕 出于上下文的考虑 我将添加我在这里提到的问题中的内容 参考问题 https stackoverflow com a 39429290 168492 https stackoverflow com a 394
  • ReactTransitionGroup 不适用于 React-redux 连接组件

    我正在开发一个更大的项目 但我创建了这个简短的示例来说明问题 如果我使用Box组件 它的工作原理 它在控制台中输出componentWillEnter and componentWillLeave当我们点击按钮时 如果我使用BoxConta
  • React autoFocus 将光标设置为输入值的开头

    我有一个受控输入 最初显示一个值 我已将该输入设置为自动聚焦 但当我希望它出现在末尾时 光标出现在输入的开头 我知道这可能是因为自动对焦是在值之前添加的 但我不能 100 确定 在输入字段末尾完成光标初始化的最佳方法是什么 var Test
  • JavaScript 中的 Promise 有什么意义?

    一个承诺是一个 可能现在可用 或将来可用 或永远不可用的值 来源 MDN 假设我有一个想要处理图片的应用程序 图片已加载 例如在算法在后台使用它之后 或某种其他类型的延迟 现在我想检查一下图片是否可以在future 通过使用承诺 而不是回调
  • 如何清除单个函数中的所有 AngularJS $scope 和 $rootScope 值?

    我需要清除所有 scope执行某些操作时的值 例如 如果我点击 Signout 按钮重定向到 signin 页面 然后所有 scope or rootScope应清除会话中的值 我怎样才能实现这个目标 您可以执行以下操作 rootScope
  • 如何使用角度材料在具有可扩展行的表格中创建嵌套垫表

    我有以下数据 id c9d5ab1a subdomain wing domain aircraft part id c9d5ab1a info mimetype application json info dependent parent
  • 如何计算特定字符在字符串中出现的次数

    我正在尝试创建一个函数来查看数组中的任何字符是否在字符串中 如果是 有多少个 我尝试计算每一种模式 但是太多了 我尝试使用 Python 中的 in 运算符的替代方案 但效果不佳 function calc fit element var
  • 使用 Google 日历源时如何禁用 FullCalendar 中的活动链接?

    我正在使用 FullCalendar 库从 Google 日历加载日历中的事件 不幸的是 事件添加到日历后 它们是可点击的 当您点击该活动时 您会自动重定向到 Google 日历页面以查看该特定活动 或者如果您有足够的访问权限 则可以直接对
  • 如何从浏览器向服务器发送“页面将关闭”消息?

    我想向每个 html 文档添加一个脚本 JavaScript 该脚本向服务器发送两条消息 页面确实打开了 页面将关闭 此消息包含页面打开的时间 打开消息应在文档加载时 或加载完成时 发送 这是简单的部分 The close message
  • 使用javascript动态更新css内容

    需要将 css 更新为动态值 我不确定最好的方法是什么 div style zoom 1 div 缩放级别将根据窗口大小调整触发 应用程序将相应缩放 我将此应用程序加载到 cordova 中并让它在 iPAD 中运行 然后我意识到需要使用
  • 使用 Jade 评估自定义 javascript 方法 (CircularJSON)

    我想通过 Jade 将一个对象解析为客户端 JavaScript 通常这会起作用 script var object JSON parse JSON stringify object but my object is circular ht
  • 主页(网格)上的缩略图现在显得模糊。如何纠正?

    我不知道这看起来是否愚蠢 但从早上开始我就无法纠正这个突然出现在我的博客网站上的错误www candidopinions in http www candidopinions in 我有一个网格视图模板 其中博客文章中的特色图像作为调整大小
  • 如何从 json 文件创建模型? (ExtJS)

    这是我想使用 json 文件创建的模型 Ext define Users extend Ext data Model fields name user id type int name user name type string 为了根据服

随机推荐

  • .NET Core API 中的自定义授权过滤器

    我想在使用我的核心 api 访问任何数据之前对用户进行授权 所以我尝试使用 JWT 身份验证 我在使用 api 登录用户时成功生成了令牌 并将该令牌保存在会话中的客户端 现在每当用户想要使用 api 访问任何数据时 我都会将该令牌在标头中发
  • 如何通过 HTTP 从 Internet 检索文件?

    我想从 Internet 下载文件 乍一看 InternetReadFile 似乎是一个很好且简单的解决方案 事实上 好得令人难以置信 事实上 经过一番挖掘 我开始发现它实际上存在很多问题 人们在使用这段代码时抱怨各种各样的问题 出现问题的
  • 如何在打印函数中定义变量?

    我是这个领域的新手 我正在尝试解决一个问题 不太确定实际上是否可能 我想在显示器上打印一些信息以及用户的一些输入 以下工作正常 gt gt gt print Hello input tellmeyourname tellmeyourname
  • 无法找到要实例化的界面控制器类“InterfaceController”

    每次运行项目并尝试导航到另一个屏幕时 我都会收到此错误 Unable to find interface controller class HelpInterfaceController to instantiate 我正在正确使用我所知道
  • 设备向上/向下和侧向倾斜会触发方向通知

    我有一个针对 iOS7 的应用程序构建 其中 UIViewController 应该支持横向左右和纵向 纵向上下颠倒 其他 ViewController 应该仅支持横向左右方向 我已使用通知来通知方向更改并相应地刷新子视图 我还在检查 UI
  • 如何使用XSLT仅获取某些行和某些列?

    如何使用 XSLT 转换此 XML 文件
  • 从 iPhone 应用程序拨打电话 [重复]

    这个问题在这里已经有答案了 可能的重复 从我的应用程序中拨打 iPhone 电话 我想通过 iPhone 应用程序拨打给定号码 您能建议任何最好的教程来解释它或告诉我这个过程吗 你可以试试 NSURL phoneNumberURL NSUR
  • 单击展开包含详细信息和摘要标签

    我正在使用单击展开折叠使用
  • 将文件内容读入ArrayList

    在之前的项目中 我需要将文件内容读取到数组中 现在我必须做同样的事情 只是我必须将内容读入 ArrayList 我遇到的几个问题是 如何逐步浏览 ArrayList 并分别添加每个项目 如果文件包含超过 10 个输入 则必须退出 我已经尝试
  • 如何在 Java 中并行运行某些东西?

    我正在尝试打印一个范围内的所有可能的组合 例如 如果我的lowerBound是 3 我的max是 5 我想要以下组合 5 4 5 3 4 3 我已经用这个实现了helper 下面找到的函数 当然 如果我的最大值很大 则需要很多组合 这将需要
  • 需要帮助使用泰勒级数逼近Python中的正弦函数

    我对 Python 很陌生 我正在尝试使用近似正弦函数this series 我的代码如下所示 import math def sin x n sine 0 for i in range n sign 1 i sine sine x 2 0
  • 测试一个数字是否是斐波那契数

    我知道如何制作斐波那契数列 但我不知道如何测试给定的数字是否属于斐波那契数列 我想到的一种方法是生成斐波那契数列 数字到该数字并查看它是否属于该数组 但必须有另一种更简单 更快的方法 有任何想法吗 一个非常好的测试是 N 是斐波那契数当且仅
  • 如何使用命令提示符连接到 mysql 服务器:错误

    我正在使用以下命令使用命令提示符连接到数据库 mysql mysql h localhost u test ptest test 但我收到以下错误 ERROR 1064 42000 You have an error in your SQL
  • Laravel 资源中的附加数据

    我使用控制器中的 Laravel 资源 data Project limit 100 gt get return response gt json ProjectResource collection data 我喜欢将附加信息传递给 Pr
  • Android:检查活动是否被系统从服务中销毁

    我有一项服务监听来自服务器的一些事件 服务有 START STICKY 标志 当它被操作系统杀死时 该标志使他重新启动 当服务收到事件时 我有两种情况 首先 如果活动没有被终止 我需要将结果发送到本地广播接收器并更新 UI 其次 如果它被操
  • 添加表单操作[关闭]

    Closed 这个问题需要细节或清晰度 目前不接受答案 当我提交时我试图再次转到index php page servers 但是当我提交表单时重定向是index php 但实际上是index php page servers 我该如何解决
  • Chrome 扩展:检测 Google 文档中的按键

    嘿 我和我的朋友们刚接触 javascript 并且遇到了一些代码问题 目前 我们正在尝试制作一个 Chrome 扩展 通过检测击键来检测用户何时以及对特定 google 文档进行了多少操作 我们当前的方法涉及创建一个 按键 事件监听器 我
  • Codeigniter SMTP 无法连接

    我正在使用 Codeigniter 3 并且我的网站上有一个简单的联系表 此联系表单在我的本地主机 XAMPP 环境中完美运行 但在我的共享 Web 托管 BT 上却不起作用 我无法弄清楚问题是什么 我一直在与他们的支持人员联系 显然 如果
  • site_url() 在 codeigniter 框架中无法正常工作

    以下代码对于 Codeigniter 框架无法正常工作 这是我的观点 a href gt Back to Main a 您应该在控制器构造方法或像这样调用视图的函数中加载 url helper this gt load gt helper
  • 在 AngularJS 中的页面之间共享数据返回空

    通常 我编写 SPA 并且通过服务在控制器之间共享数据很简单 我没有使用 SPA 格式 没有使用 ng view 并尝试在页面之间共享数据 但在加载第二个页面 以获取数据 时它是空的 第 1 页 索引 html div div