angular中控制器之间的传值该怎么实现?
答主老司机们的回答都是经典, 有一个回答有提到了angualr的编写规范.&br&我们的项目在按照规范写了之后真的在各方面都变得嗨了很多.&br&这是规范的链接.
拿出来大家去看看&br&&a href=&///?target=https%3A///johnpapa/angular-styleguide/blob/master/i18n/zh-CN.md& class=& wrap external& target=&_blank& rel=&nofollow noreferrer&&angular-styleguide/zh-CN.md at master · johnpapa/angular-styleguide · GitHub&i class=&icon-external&&&/i&&/a&&br&-------------更新线,下为原文----------------------&br&&br&&br&&img src=&/d0733c41fd_b.png& data-rawwidth=&922& data-rawheight=&626& class=&origin_image zh-lightbox-thumb& width=&922& data-original=&/d0733c41fd_r.png&&&br&有找到这么一个解决方案.&br&&a href=&///?target=http%3A///whitewolf/archive//3024843.html& class=& wrap external& target=&_blank& rel=&nofollow noreferrer&&Angularjs Controller 间通信机制&i class=&icon-external&&&/i&&/a&&br&这种方案如果父controller之间甚至父的父controller之间仍是兄弟关系如同这个案例这样..还有什么方案推荐么...&br&&br&&br&其实还有一个想问的 就是有关于$scope.$id&br&&br&还有 现在也获取到了每个controller 的 $scope.$id($scope1的$id 为15,$scope2 的$id为22), 能有什么办法 在controller2中通过15 这个$scope1的$id从而获取到$scope1 这个对象呢?&br&&br&画图不易 T.T &br&老司机们快来答题 -3-
答主老司机们的回答都是经典, 有一个回答有提到了angualr的编写规范.我们的项目在按照规范写了之后真的在各方面都变得嗨了很多.这是规范的链接.
拿出来大家去看看-------------更新线,下为原文----------------------…
按投票排序
每个controller都会有自己的scope，所有的scope都是属于 $rootScope的子或者子的子...那么问题就好解决了，通过
$rootScope.$broadcast 广播的事件每个controller都能收到事件
上面的说的基本上很全了，我再总结补充一下吧。通过Angular的话可以通过下面四种方法1、event这里可以有两种方式，一种是$scope.$emit，然后通过监听$rootScope的事件获取参数；另一种是$rootScope.$broadcast，通过监听$scope的事件获取参数。这两种方法在最新版本的Angular中已经没有性能区别了，主要就是事件发送的方向不同，可以按实际情况选择。2、service可以创建一个专用的事件Service，也可以按照业务逻辑切分，将数据存储在相应的Service中，因为已经有人提过了就不赘述了。3、$rootScope这个方法可能会比较dirty一点，胜在方便，也就是把数据存在$rootScope中，这样各个子$scope都可以调用，不过需要注意一下生命周期4、直接使用$scope.$$nextSibling及类似的属性类似的还有$scope.$parent。这个方法的缺点就更多了，官方不推荐使用任何$$开头的属性，既增加了耦合，又需要处理异步的问题，而且scope的顺序也不是固定的。不推荐另外就是通过本地存储、全局变量或者现代浏览器的postMessage来传递参数了，除非特殊情况，请避免这类方式。最后这个代码风格可以参考一下，对代码的整体组织可以有些帮助以上参考
如其他答案，可以用event。另外，我的经验是，尽量不要用event传数据。应该建立一个service来保存数据，并且设置相应getter/setter，具体如下：每个controller依赖service, call service.setter(...)统一的service.setter(...)在改完数据后可以$emit('data-updated')每个controller里$on('data-updated', function(){
$scope.data = service.getData() })
看我这个栗子的最后两个选项卡然后，原理在这里：
直接建一个service，不要用什么事件，项目一大N多个controller或者N久再去维护会玩死你，service里提供存和取的方法，简单明了，API容易查找和修改，调试也方便无混乱的依赖关系
已有帐号？
无法登录？
社交帐号登录AngularJS进阶(二十七)实现二维码信息的集成思路
博客专家
AngularJS进阶(二十七)实现二维码信息的集成思路
AngularJS进阶
AngularJS实现二维码信息的集成思路
& & & &赠人玫瑰，手留余香。若您感觉此篇博文对您有用，请花费2秒时间点个赞，您的鼓励是我不断前进的动力，与君共勉！
& & & 实现生成的二维码包含订单详情信息。
获取的内容数据如下:
& & & 现在可以获取到第一级数据，第二级数据data获取不到。利用第一级数据的获取方法获取不到第二级数据。
for(i in data){
//获得属性
if(typeof(data[i]) == &object&){
var tmp = data[i];
for(j in tmp){
alert(tmp[j]);
alert(data[i]);
//获得属性值
& & & 经过层层解析，获取到的数据结构如下所示:
& & & 经过进一步的优化改进，获取到的数据详情如下所示:
& & & 接下来面临的问题就是:如何实现两个html页面间传值？通过搜索,不同页面之间的传值方法有:1.地址传值(get)&&2.cookie&&3.localstorage&&4.sessionStorage&&5.flash&&6.依赖后端服务器。根据不同场景和需求选择不同方案。
& & & 经过自己的多次尝试，终于在localstorage这条路上走通了。
& & & 但是在二维码显示的环节上遇到了问题，太大(见下图左)的话影响布局，太小(见下图右)的话二维码无法解析。
& & & & & & &&& & & & & & & & & & & & &
& & & 自己必须找到一个折中的办法，看来得重新布局一下了，原始布局如下所示:
& & & 改善的页面布局如下：
var medInfo = &{&;
for(i in data){
//alert(i);
// 获得属性
对获取信息进行筛选
if(typeof(i) != &undefined& && i != &stat& && i != &merch_uid& && i != &result& && i != &errtext&) {
switch (i) {
case &tx_time&:
trans = &交易时间&;
case &buy_uid&:
trans = &购药者帐号&;
case &buy_addr&:
trans = &收货地址&;
case &receiver&:
trans = &收货人&;
case &receiver_tel&:
trans = &收货人电话&;
case &old_amt&:
trans = &药品总价&;
case &amt&:
trans = &支付金额&;
case &merch_name&:
trans = &配送药店&;
case &msg&:
trans = &客户留言&;
case &cnt&:
trans = &药品种类&;
case &data&:
trans = &药品列表&;
medInfo += &\&& + trans + &\&:&;
if(typeof(data[i]) == &object&){
tmp = data[i];
//alert(&这是一个object对象&);
//alert(data[i]);
// 获得属性值
medInfo += &\&& + data[i] + &\&,\n&;
//alert(tmp.length);
// 获取二级数据(购物车内容)
for(k = 0; k & tmp. k++){
zqy = tmp[k];
for(j in zqy){
//alert(j);
对获取信息进行筛选
switch (j) {
case &medcnt&:
trans = &药品数量&;
case &medamt&:
trans = &金额总计&;
case &medname&:
trans = &药品名称&;
case &medprice&:
trans = &药品价格&;
case &medid&:
trans = &药品ID&;
if(tag == 1){
medInfo += &\n[\&& + trans + &\&:&;
medInfo += &\&& + trans + &\&:&;
//alert(zqy[j]);
medInfo += &\&& + zqy[j] + &\&,\n&;
if(k == tmp.length-1){
medInfo += &]&;
medInfo += &],[&;
medInfo += &}&;
//alert(medInfo);// 最终的订单详情
document.getElementById(&sunny&).innerHTML = medI
//alert(document.getElementById(&sunny&).innerHTML);
localStorage.setItem('billInfo', medInfo);
// 当页面加载的时候可以调用某些函数
window.onload = function(){
alert(localStorage.getItem('billInfo'));
console.log(localStorage.getItem('billInfo'));
var a = parent.document.getElementById(&sunny&);
var qrcode = new QRCode(document.getElementById(&qrcode&), {
width : 96, // 设置二维码宽高96
height : 96
qrcode.makeCode(localStorage.getItem('billInfo')); // 默认二维码内容
qrcode.makeCode(&http://192.168.1.105:8088/lmapp/billInformation.html&);
有图有真相
扫码后效果图
我的热门文章
即使是一小步也想与你分享从StackOverflow看Angular 1.x - 简书
下载简书移动应用
写了6105字，被20人关注，获得了29个喜欢
从StackOverflow看Angular 1.x
去年 IE Team 把 issue tracker 放到 StackOverflow 之后，我一度以为 SO 会革了 MSDN Library 和 Forum 的命（也就是让我丢掉饭碗），就像 GitHub 干掉 Codeplex 和 Google Code 一样。刚好当时我学习和实践 AngularJS 有一段时间了，我就想到 SO 上试试身手，看看自己的水平，是否能够帮助到别人。
于是我每天大概花半个小时不到在 SO 的
tag 下面解答问题。玩了半个月左右，拿到一千多分。在 SO 上刷分当然不是目的，但是分数比较好的体现了你回答的问题的准确度和热门度，所以我比较关注这个指标，但这个过程只能用艰难来形容。之所以称之为艰难，主要原因有两个。
如果题目比较基础，解答相对容易。但是你会遇到很多三哥朋友们第一时间冲出来回答。甚至很多时候，你已经做出解答了，他们还源源不断地 post 和你一模一样的 answer 。
如果题目比较深入，确实没有三哥和你抢了，但很多时候这也意味着，没有多少人会关注这个问题，为你的答案点赞。
这两个现象其实都来源于一个 root cause ：基础的问题，回答起来更容易，花的时间更少，得到的分数更多。而这样的问题，受到所有人的喜爱。为什么呢？对于抢分狂魔而言，这种题目分数更好得；对于热心答题不计较分数的好心人而言，回答这种问题，能够把时间省下来帮助更多的人，何乐而不为？当整个社区都呈现这种状态是，你就不难得到当年老赵对 SO 的评论：如果你经过深思熟虑也无法解决的问题，丢到 SO 上，也基本上不会得到你想要的答案。这是个悲伤的结论，但确实真实的故事。
SO 其实也意识到这个问题了我估计，于是他们搞了个 Golden Badge 叫做Unsung Hero。获得这个 Badge 的条件是，你超过一半的答案被选为正确答案，但是没人给你 upvote（也就意味着关注度小）。真的是名副其实，无名英雄。最开始拿到这个 Badge 的时候，我并没有特别高兴。但当我得到上面的结论时，我就释然了。高兴了无聊了工作累了，我就爬上去回答一些我知道的问题。
这几天突然看到自己又一次上了 AngularJS 这个 Tag 的Last 30 days top answerers，我想，既然在 SO 上最热门最抢手的问题都是比较基础的、简单的，这也间接说明，对于新手而言，这些知识点具备一定学习曲线，并没有那么容易上手和熟悉。如果把这些知识点和问题做一个整理，这一定是一个不错的文档，也能从中看出这个语言或框架在设计方面的不足。于是我从前到后阅读了一遍我回答过的 Angular 的问题，很快发现不少反复出现或者同类型的提问。
下面让我们一起，从我的角度，看看大家学习 Angular 1.x 的时候通常会遇到哪些困难。
一：Angular Principles
第一类问题是关于 Angular 的运行原理。像 ASP.NET 这种框架，你大部分时候都不需要理解它的机制，而当你不得不去理解 ASP.NET 是怎么运行，那基本说明你遇到了非常坑爹的问题了。但是 Angular 并不是这样的，即使你是上手才半个礼拜的新手，当你需要完成一些特定的功能，你就不得不理解 Angular 的 principles，否则你就会掉入坑中爬不出来。这也就是业界对 Angular 最大的批评，学习曲线比较高。
Digest Loop
这是我心目中的 Angular 第一大杀手。很多前端工程师从纯 JS 或者别的框架迁移到 Angular 的时候，最经常问的就是，为什么我更新了某某 object 的值，页面上没有更新呢？ Angular 使用 Digest cycle 来实现 two way binding，而他们的操作并没有进入到这个 cycle 中，比如 ，, 。 GitHub 上有这样一群 repo ，他们专门负责把第三方的 library 进行包装，使得能够在 Angular 中使用。老实讲， Angular 养活了一批人呢。等2.0上市了，大家又要一股脑儿把这些 library 重新包装，有兴趣的同学不妨试试，是个不错的学习 Angular 和 Contribute to Open Source 的机会。
还有就是在写 directive 的时候，更新了 model 却不能
好不容易 developer 知道可以使用 $apply $digest 去手动 trigger digest loop，他们也会经常遇到
的问题，简直要疯了。
Expressions
Angular 中有你可以这么使用expression
在 built-in 的 directive 中，比如 &input type="text" name="userName" ng-model="user.name"
另一种就是使用 double bracket {% raw %} &p&My first expression: {{ value }}&/p&{% endraw %}。
可是奇怪的事情，当你使用ng-src的时候，你需要这样写 {% raw %}&img ng-src="/avatar/{{hash}}" alt="Description"/& {% endraw %}... 我已经不知道该说什么好了 ...你可以再看看这里 , 。
很多人搞不对expression也可能是因为没有理解 scope 。scope 既是连接 controller 和 view 的胶水，也是 expression 的运行环境。很多朋友在这里栽了，带来的结果往往是搞不定
Module definition
如果你只是通过官方的demo来学习Angular，你可能会搞不清楚angular.module('app', [])和angular.module('app')的区别，并且由于调用的错误，导致 module 不断地被反复 。
Angular config/run phase
在 module 的 bootstrap 过程中，你可以通过指定自定义的 Configuration blocks 来操作 provider/constants，或者使用 Run blocks 来配置 instances／constants ，千万不要。
一般 dependency injection 出现问题，基本都是用户粗心，或者是使用了 minification 。
二：Directive
什么是 directive ，这里我只简单贴一下官方的说法
At a high level, directives are markers on a DOM element (such as an attribute, element name, comment or CSS class) that tell AngularJS's HTML compiler ($compile) to attach a specified behavior to that DOM element or even transform the DOM element and its children.
directive 能够很好滴帮助实现模块化，在 Angular 在自己的实现过程中，就把不少功能以 directive 的方式提供给开发者。用户也可以自己书写 directive 对功能进行抽象。在我看来，directive 往往是初学者比较难以掌握的。
Built-in Directives
首先是 Angular 提供的 directive 。有的时候，即使是认真研习文档，你也不一定能够成功理解它们的运行机制，很多朋友在这里就吃了苦头了。印象里 built-in directive 这个方面我拿分相对容易，因为我比较勤劳，如果文档不能够帮助解决问题的话，我会直接跑去看源码。如果问我泡 StackOverflow 最大的收获是什么，那一定是读了不少 Angular 的 source code。
SO 上经常会提及的 built-in directive 有
。尤其是后者，满多人上来问，我该怎么用 ng-repeat 实现 xxx 功能，基本都是因为他们不知道 ng-repeat-start/end .
玩过 Angular 的同学都知道，如果页面 loading 比较慢，就会看到页面上充满着各种花括号，然后才会变成相应的文字。为了解决这种问题， Angular 给我们提供了 ng-cloak （ng-bind也能实现一样的效果）。这是我给 交的第一个 pr :)
-/ 在使用 JQuery 的时候，可以直接操作 DOM 来添加样式，但这并不是 Angular 推荐的方式。很多人意识到了这点，他们只是刚好没听说 ngStyle/ngClass 。
Write your own directive
除了使用 built-in 的 directive ，Angular 也鼓励大家来写自己的 directive。但是这里大家经常会遇到
或者是如何给 ，再或者从 directive 中 。
$http 只是一个 built-in 的 service ，但我要把它单独拿出来讲一讲，一方面是因为这是一个非常基础的 service （访问后台 Rest API ），另一方面是 developer 在和 $http 总会不约而同的想静静。
Encoding 真的是所有程序员的噩梦。到底是 form 还是 json 还是 byte array ？如何设置 header ？如何配置 callback ？
Cache 为了减少 call 后台的 cost，$http 提供了 。
Headers 论如何为所有的 $http request 配置 。
CORS. Angular 把 rendering engine 搬到了浏览器里，我们需要通过 ajax 向 backend server 抓取数据然后在页面上渲染，这就不可避免的遇到了 cross domain 的各种 failure ，算得上前端届又一个
Promise. ASP.NET 有 async/wait，你猜 Angular 里面
interceptor. Angular 允许你 customize $http 的 。
最后，读者朋友如何跑到我博客首页看一看，你还能看到去年我对 Angular 的吐槽
。是的，我喷的就是 $http ，虽然没有什么卵用。
四：Best Practice
还有一类问题，来自有理想有追求的朋友。他们想知道如何 think in Angular，如何操作能够有比较好的 performance等等。
Communication/Data Sharing between Controllers/Factories
当你想在不同的 context 之间共享 data 的时候，全局变量堪称 fast and dirty 。但不幸的是，从你上大学的第一天开始，就有人不断告诉你这么做是不负责任滴。于是为了避免被同事 code review 的时候 challenge，不断有人来问该 在
。俗称，月经帖。
Model binding/Performance Enhancement
其实这个和上文提到的
可以放在一起谈。Angular 使用了 dirty check 去实现 two-way binding，也就是很傻瓜地反复地遍历 watch list，看看大家有没有什么更新。当页面上的绑定的 element 开始增多（大概2000+），dirty check 就会严重拖累整个页面的 performance。
dirty check 简直是 Angular 1.x 的阿克琉斯之踵，然后谷歌的大大们在2.0中，把它无情地抛下了。听闻这个消息，我等屁民“弹冠相庆”，谁让它
去年四月我第一次接触 Angular，写了点自嗨的，转眼已经过去十三月了。短短的一年光阴，Angular 1.x 已经确立了不可撼动的一哥地位，而2.0 也已经“洗心革面”马上要出来重新做人。拭目以待啊。
如果觉得我的扯淡对您有用，请随意打赏。或者到我的博客看看
打开微信“扫一扫”，打开网页后点击屏幕右上角分享按钮
被以下专题收入，发现更多相似内容：
玩转简书的第一步，从这个专题开始。
想上首页热门榜么？好内容想被更多人看到么？来投稿吧！如果被拒也不要灰心哦～入选文章会进一个队...
· 100893人关注
简书程序员大本营
投稿须知：
1.本专题仅收录与程序有关的文章。
2.请在代码框里写代码，尽量保证可看性。
关注简书官...
· 90674人关注
Write the Code, Change the World, 改变世界从编程开始, 收集编程相关的干货
· 10295人关注
如果觉得我的扯淡对您有用，请随意打赏。或者到我的博客看看
选择支付方式：AngularJS&学习笔记值post传值
问题直接调用$http.post()方法时
传值格式是这样的
php接收端接收到的是json格式的，怎么做的跟Ajax post那样传值呢？
分析原因，angular的$http.post()方法默认数据传输格式是json的
& & & post:
{'Content-Type': 'application/charset=utf-8'},
& & & put:
&{'Content-Type':
'application/charset=utf-8'}
所以要修改传输格式
解决方法如下
在angular模块中加入
//修改post方式 form格式传值
angular.module('MyModule', [], function($httpProvider)
{//MyModule是你自己的app名称
& // Use x-www-form-urlencoded
Content-Type
$httpProvider.defaults.headers.post['Content-Type'] =
'application/x-www-form-charset=utf-8';
$httpProvider.defaults.headers.put['Content-Type'] =
'application/x-www-form-charset=utf-8';
& var param = function(obj) {
& & var query = '', name,
value, fullSubName, subName, subValue, innerObj,
& & for(name in obj) {
& & & value
= obj[name];
if(value instanceof Array) {
& for(i=0; i
& & subValue = value[i];
& & fullSubName = name + '[' + i
& & innerObj = {};
& & innerObj[fullSubName] =
& & query += param(innerObj) +
& & & else
if(value instanceof Object) {
& for(subName in value) {
& & subValue =
value[subName];
& & fullSubName = name + '[' +
subName + ']';
& & innerObj = {};
& & innerObj[fullSubName] =
& & query += param(innerObj) +
& & & else
if(value !== undefined && value !== null)
& query += encodeURIComponent(name) + '=' +
encodeURIComponent(value) + '&';
& & return query.length ?
query.substr(0, query.length - 1) :
& // Override $http service's default
transformRequest
& $httpProvider.defaults.transformRequest =
[function(data) {
& & return
angular.isObject(data) && String(data) !== '[object File]'
? param(data) :
&综上所述，问题就解决了。<img TYPE="face" src="/blog7style/images/common/sg_trans.gif" real_src ="/uc/myshow/blog/misc/gif/E___7392ZH00SIGG.gif" STYLE="line-height: 1.5;"
ALT="AngularJS&学习笔记值post传值"
TITLE="AngularJS&学习笔记值post传值" />
已投稿到：
以上网友发言只代表其个人观点，不代表新浪网的观点或立场。