虽然网上概括了四种或更多的传值方式,但我现在用的顺手的就两种

首先要知道AngularJs可以构建一个单页面应用程序,所以我划分为跨控制器传值 和 跨页面传值 两类

1、跨控制器传值—— $rootScope

原理:所有的应用都有一个 $rootScope,它可以作用在 ng-app 指令包含的所有 HTML 元素中。

$rootScope 可作用于整个应用中。是各个 controller 中 scope 的桥梁。用 rootscope 定义的值,可以在各个 controller 中使用

应用:所以在跨控制器传值时候就可以用$rootScope

案例:比如我要把控制器ControllerA中的对象,点击事件ToB()要转入ControllerB中调用

注:要注入$rootScope

 app.controller('ControllerA', function ($scope, $rootScope) {
$scope.ToB=function(){
$rootScope.Model=$scope.Model;
}
});

app.controller('ControllerB', function ($scope, $rootScope) { $scope.ModelB=$rootScope.Model; });

缺点:只要刷新页面$rootScope的值就不存在了

2、用地址Url传值——用$location获得地址栏里的参数

注:要注入$location

案例1:在页面A的Controller中

$scope.goLog = function (orderServiceId) { window.location.href = "#/serviceLogs?orderServiceId=" + orderServiceId; }

在页面B中

var orderServiceId = parseInt($location.search().orderServiceId);

可以用restFul风格的路径

案例2:在页面A的控制器中

注:要注入$routeParams

  $scope.edit = function (role) {
window.location.href = "#/roles/" + role.RoleID + "/edit";
}

在接受参数B控制器中

  var roleID = parseInt($routeParams.id);

注:仅个人理解及笔记,有错误的地方请各位指正!

angularJs 跨控制器与跨页面传值的更多相关文章

  1. 【2017-05-21】WebForm跨页面传值取值、C#服务端跳转页面、 Button的OnClientClick属性、Js中getAttribute和超链接点击弹出警示框。

    一.跨页面传值和取值: 1.QueryString - url传值,地址传值 优缺点:不占用服务器内存:保密性差,传递长度有限. 通过跳转页面路径进行传值,方式: href="地址?key= ...

  2. WebForm跨页面传值取值、C#服务端跳转页面、 Button的OnClientClick属性和超链接点击弹出警示框

    一.跨页面传值和取值: 1.QueryString - url传值,地址传值 优缺点:不占用服务器内存:保密性差,传递长度有限. 通过跳转页面路径进行传值方式: href="地址?key=v ...

  3. 跨页面传值之QueryString

    跨页面传值常用方法 1.QueryString 2.Form-post控件传递 3.Cookies传递 4.Application传递 5.Session传递(灵活强大) 1.query传值 http ...

  4. 【页面传值6种方式】- 【JSP 页面传值方法总结:4种】 - 【跨页面传值的几种简单方式3种】

    阅读目录 1. URL 链接后追加参数 2. Form 3. 设置 Cookie 4. 设置 Session JSP 页面间传递参数是项目中经常需要的,这应该算是 web 基本功吧. 试着将各种方式总 ...

  5. mui框架开发aop的跨页面传值

    mui开发跨平台app,其实不乏会涉及到跨页面传值,今天给大家简单介绍一种常用也是简单的传值方法 咱在这里设置一个场景,就是两个页面进入到同一页面展示不同的元素,此时需要在这两个页面各自设置一个区别的 ...

  6. ASP.NET跨页面传值技巧[总结]

    个人网站:http://www.51pansou.com .net视频下载:.net视频教程 .net源码下载:.net源码 关于页面传值的方法,我就我个人观点做了些总结,希望对大家有所帮助. 1.  ...

  7. AngularJs最简单解决跨域问题案例

    AngularJs最简单解决跨域问题案例 2016-05-20 09:18 82人阅读 评论(0) 收藏 举报  分类: javascript(1)  作者:白狼 出处:http://www.mank ...

  8. ThinkPHP中的跨控制器调用与框架执行流程

    一.跨控制器调用 UserController.class.php <?php namespace Home/Controller use Think/Controller class User ...

  9. [转]html5: postMessage解决跨域和跨页面通信的问题

    [转]html5: postMessage解决跨域和跨页面通信的问题 平时做web开发的时候关于消息传递,除了客户端与服务器传值,还有几个经常会遇到的问题: 多窗口之间消息传递(newWin = wi ...

随机推荐

  1. YQCB冲刺周第三天

    团队讨论照片 今天的任务为实现由用户记录一条数据,向数据库中添加一条数据. 遇到的问题为获取单选框.下拉菜单的参数.

  2. OA_1界面

    <%@ page language="java" contentType="text/html;charset=GB18030" pageEncoding ...

  3. java程序连接MySQL数据库

    驱动程序:mysql-connector-java-5.1.7-bin.jar. 程序示例如下: package commonProject; import java.sql.Connection; ...

  4. jQuery之css

    设置css样式/读取css值 css() 1. 得到第一个p标签的颜色 2. 设置所有p标签的文本颜色为red 3. 设置第2个p的字体颜色(#ff0011),背景(blue),宽(300px), 高 ...

  5. [2017BUAA软工]第二次博客作业:代码复审

    〇.comment链接 https://github.com/hanayashiki/Sudoku/issues/1 一.代码复审 1.概要部分 (1)代码能符合需求和规格说明么? 经测试,对于合法输 ...

  6. QMdiArea及QMdiSubWindow实现父子窗口及布局方法

    版权声明:若无来源注明,Techie亮博客文章均为原创. 转载请以链接形式标明本文标题和地址: 本文标题:QMdiArea及QMdiSubWindow实现父子窗口及布局方法     本文地址:http ...

  7. (九) 使用Jmeter 做分布式压测 ;

    在使用Jmeter进行性能测试时,如果并发数比较大(比如最近项目需要支持1000并发),单台电脑的配置(CPU和内存)可能无法支持,这时可以使用Jmeter提供的分布式测试的功能. 一.Jmeter分 ...

  8. 【Python】Python 猜年龄的游戏

    游戏规则: 允许用户最多尝试3次 每尝试3次后,如果还没猜对,就问用户是否还想继续玩,如果回答Y或y, 就继续让其猜3次,以此往复,如果回答N或n,就退出程序 如何猜对了,就直接退出 age= cou ...

  9. 51nod-1222-最小公倍数计数

    题意 给到 \(a,b\) ,求 \[ \sum _{i=a}^b\sum _x\sum _y[x\le y][\text{lcm}(x,y)=i] \] 即最小公倍数在 \([a,b]\) 中的有序 ...

  10. 深入理解JVM一配置参数

    一.JVM配置参数分为三类参数: 1.跟踪参数 2.堆分配参数 3.栈分配参数 这三类参数分别用于跟踪监控JVM状态,分配堆内存以及分配栈内存. 二.跟踪参数 跟踪参数用于跟踪监控JVM,往往被开发人 ...