Blood 血腥的方法

每个controller都有自己的scope, 同时也可以共享他们老爸的scope内的数据。如果我们想让两个controller共享数据的化, 有多种方法。 最直接血腥的就是在他们老爸的scope里定义一个model。

<input type="text" ng-model="person.name"/>
<div ng-controller="FirstCtrl">
{{person.name}}
<button ng-click="setName()">set name to jack</button>
</div>
<div ng-controller="SecondCtrl">
{{person.name}}
<button ng-click="setName()">set name to jack</button>
</div>
</div>

需要注意的是, 必须定义一个对象, 并且在每个controller里都是修改这个对象的属性。比如在FirstController里的setName 里修改name: person.name = 'Jack' , 如果你在setName里 person = {name: 'Jack'} 呵呵, 效果大家自己试试, 原因是js的prototype的特性。

这个方法血腥的原因是所有共享的数据都要在上级定义, 如果子controller多了, 共享数据是指数级上升的, 如此老爸的负担会超大。那些controller共享了那些数据会很模糊。而且测试非常空难。最后一条对于不正经的js开发人员, 估计不是什么问题。

Elegant 优雅的方法

var myApp = angular.module("myApp", []);
myApp.factory('Data', function() {
return {
name: "Ting"
}
});
myApp.controller('FirstCtrl', function($scope, Data) {
$scope.data = Data; $scope.setName = function() {
Data.name = "Jack";
}
}); myApp.controller('SecondCtrl', function($scope, Data) {
$scope.data = Data; $scope.setName = function() {
Data.name = "Moby";
}
});

什么才不是血腥的呢?angularjs最突出的特殊之一就是DI, 也就是注入, 利用factory把需要共享的数据注入给需要的controller可以干净漂亮的解决这个问题。

原文出处:https://github.com/tiw/angularjs-tutorial/blob/master/sharing-data-between-controllers.markdown

在controller间分享数据(第一种办法)的更多相关文章

  1. Angularjs Controller间通信的几种方法

    先说最简单的,适合简单数据 一.使用controller as <body ng-controller="ParentCtrl as parent"> <inpu ...

  2. Fragment回调接口应用间分享数据

    package com.example.mydemo; import java.util.List; import android.app.Activity; import android.app.A ...

  3. 详解 Qt 线程间共享数据(用信号槽方式)

    使用共享内存.即使用一个两个线程都能够共享的变量(如全局变量),这样两个线程都能够访问和修改该变量,从而达到共享数据的目的. Qt 线程间共享数据是本文介绍的内容,多的不说,先来啃内容.Qt线程间共享 ...

  4. Qt学习:线程间共享数据(使用信号槽传递数据,必须提前使用qRegisterMetaType来注册参数的类型)

    Qt线程间共享数据主要有两种方式: 使用共享内存.即使用一个两个线程都能够共享的变量(如全局变量),这样两个线程都能够访问和修改该变量,从而达到共享数据的目的: 使用singal/slot机制,把数据 ...

  5. 详解 Qt 线程间共享数据(使用signal/slot传递数据,线程间传递信号会立刻返回,但也可通过connect改变)

    使用共享内存.即使用一个两个线程都能够共享的变量(如全局变量),这样两个线程都能够访问和修改该变量,从而达到共享数据的目的. Qt 线程间共享数据是本文介绍的内容,多的不说,先来啃内容.Qt线程间共享 ...

  6. laravel5.5框架中视图间如何共享数据?视图间共享数据的两种方法

    laravel框架中视图间共享数据有两种,一种是用视图门面share()方法实现,另一种是用视图门面composer() 方法实现,那么,两种方法的实现究竟是怎样的呢?让我们来看一看接下来的文章内容. ...

  7. 【分享】通过Excel生成批量SQL语句,处理大量数据的好办法

    我们经常会遇到这样的要求:用户给发过来一些数据,要我们直接给存放到数据库里面,有的是Insert,有的是Update等等,少量的数据我们可以采取最原始的办法,也就是在SQL里面用Insert into ...

  8. Androidclient和server端数据交互的第一种方法

    网上有非常多样例来演示Android客户端和server端数据怎样实现交互只是这些样例大多比較繁杂,对于刚開始学习的人来说这是不利的.如今介绍几种代码简单.逻辑清晰的交互样例,本篇博客介绍第一种: 一 ...

  9. Windows Phone 几种页面间传递数据的方式

    首先,我们要引用:using Microsoft.Phone.Shell; 第一种: // 导航到新页面 NavigationService.Navigate(new Uri("/Detai ...

随机推荐

  1. git add和被ignore的文件

    如果有如下的目录结构: workspace tree | --------------------- |                             | hello.c           ...

  2. HDU 1556 Color the ball - from lanshui_Yang

    Problem Description N个气球排成一排,从左到右依次编号为1,2,3....N.每次给定2个整数a b(a <= b),lele便为骑上他的“小飞鸽"牌电动车从气球a ...

  3. CSS浏览器兼容问题集-第一部分

    CSS对浏览器的兼 容性有时让人很头疼,或许当你了解当中的技巧跟原理,就会觉得也不是难事,从网上收集了IE7,6与Fireofx的兼容性处理方法并整理了一下.对于 web2.0的过度,请尽量用xhtm ...

  4. JS笔试题

    JS 引用相关题目 以下代码输出什么? 为什么? var a = {n:1}; var b = a; a = {n:2}; a.x = a ; console.log(a.x); console.lo ...

  5. kururu的VHDL学习笔记

    最近开始做课程设计,VHDL设计一个中央空调的控制程序.所以开始学习VHDL,在这篇文章里面记录一些自己的笔记,期望对于同样的初学者有些借鉴意义~ 编写VHDL所需的工具: 那自然很是quartus啦 ...

  6. (转)ZOJ 3687 The Review Plan I(禁为排列)

    The Review Plan I Time Limit: 5 Seconds      Memory Limit: 65536 KB Michael takes the Discrete Mathe ...

  7. PHP 表单验证 - 完成表单实例

    ------------------------------------------------------------------------------------------- 本节展示如何在用 ...

  8. Python的if判断与while循环

    1.if判断 Python 编程中 if 语句用于控制程序的执行,基本形式为: if 判断条件: 执行语句 else: 执行语句 Python中使用缩进代替c语言中的大括号,来告诉程序所执行的内容. ...

  9. JavaScript原型链与继承

    最近学习了<Javascript高级程序设计>面向对象部分,结合书中的例子总结一下原型链和继承部分的内容. 创建对象 在Js当中没有类这个概念,当我们想要创建具有相同属性的对象的时候,有如 ...

  10. UE是什么意思?用户体验设计师与UE设计是什么关系?

    本文来自:http://blog.sina.com.cn/s/blog_a6bebb3f01015h47.html 什么是UE(UE——UE就是用户体验度) 你会发觉他的使用很人性化:功能强大但操作简 ...