controller共享数据
刚开始使用angularjs,能感受到他的强大,也在学习的途中遇到一些问题
一般我们在angularjs中共享数据使用DI的方法,具体代码如下:
<script>
angular.module('myApp.service',[])
.factory('myService', function () {
var arr=[];
return{
add: function () {
arr.push(1);
},
data:arr
};
});
var myApp=angular.module('myApp',["myApp.service","myApp.filter"]);
myApp.controller('myController1', function ($scope,myService) {
$scope.hi=myService.data;
$scope.add= function () {
myService.add();
}
})
.controller('myController2', function ($scope,myService) {
$scope.hi=myService.data;
});
</script>
这样使用有一个问题,从服务返回的对象只能绑定对象实现双向绑定,如果使用返回对象的属性进行绑定就会出现绑定不上的问题.如下
controller('myController2', function ($scope,myService) {
$scope.hi=myService.data.length;
});
这个时候,如果希望绑定返回对象的属性值得时候该怎么做呢,我想到了使用自定义过滤器的方法解决.
如下面的列子,我希望能双向绑定数组对象的长度属性.
<script>
angular.module('myApp.service',[])
.factory('myService', function () {
var arr=[];
var obj={lg:0};
return{
add: function () {
arr.push(1);
obj.lg+=1;
},
data:arr,
KK:obj
};
});
angular.module('myApp.filter',[])
.filter('capitalize', function () {
return function (input) {
if(input){
return input.lg;
}
}
});
var myApp=angular.module('myApp',["myApp.service","myApp.filter"]);
myApp.controller('myController1', function ($scope,myService) {
$scope.hi=myService.data;
$scope.add= function () {
myService.add();
}
})
.controller('myController2', function ($scope,myService) {
$scope.hi=myService.KK;
});
</script>
当界面绑定数据的时候进行过滤,就可以得到想要的结果
controller共享数据的更多相关文章
- Angularjs调用公共方法与共享数据
这个问题场景是在使用ionic开发页面的过程中发现,多个页面对应的多个controller如何去调用公共方法,比如给ionic引入了toast插件,如何将这个插件的调用变成公共方法或者设置成工具类,因 ...
- angularJS平行控制器间共享数据
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...
- 多租户实现之基于Mybatis,Mycat的共享数据库,共享数据架构
前言 SaaS模式是什么? 传统的软件模式是在开发出软件产品后,需要去客户现场进行实施,通常部署在局域网,这样开发.部署及维护的成本都是比较高的. 现在随着云服务技术的蓬勃发展,就出现了SaaS模式. ...
- 让AngularJS的controllers之间共享数据
如何让controller之间共享数据呢?大致是让不同controller中的变量指向同一个实例. 通过service创建一个存放共享数据的对象. .service("greeting&qu ...
- angular 使用服务共享数据需要注意
在使用服务共享数据时,需要注意一些细节,否则会出现视图不刷新,也不报错这样的问题,遇到了,总结下 如下: <div ng-controller='ctr1'> <a href={{n ...
- 78.PL和PS通过BRAM交互共享数据
本篇文章目的是使用Block Memory进行PS和PL的数据交互或者数据共享,通过zynq PS端的Master GP0端口向BRAM写数据,然后再通过PS端的Mater GP1把数据读出来,将结果 ...
- laravel5.5框架中视图间如何共享数据?视图间共享数据的两种方法
laravel框架中视图间共享数据有两种,一种是用视图门面share()方法实现,另一种是用视图门面composer() 方法实现,那么,两种方法的实现究竟是怎样的呢?让我们来看一看接下来的文章内容. ...
- iOS: 在iPhone和Apple Watch之间共享数据: App Groups
我们可以在iPhone和Apple Watch间通过app groups来共享数据.方法如下: 首先要在dev center添加一个新的 app group: 接下来创建一个新的single view ...
- 应用间共享数据方法(一)---sharepreferce
SharedPreferences类,它是一个轻量级的存储类,特别适合用于保存软件配置参数. SharedPreferences保存数据,其背后是用xml文件存放数据,文件存放在/data/data/ ...
随机推荐
- Spring 的 NamedParameterJdbcTemplate(转)
NamedParameterJdbcTemplate类是基于JdbcTemplate类,并对它进行了封装从而支持命名参数特性. NamedParameterJdbcTemplate主要提供以下三类方法 ...
- C的文件操作2
[转] C语言文件操作 概述 所谓文件(file)一般指存储在外部介质上数据的集合,比如我们经常使用的mp3.mp4.txt.bmp.jpg.exe.rmvb等等.这些文件各有各的用途,我们通常将它 ...
- 关于SQL Cookbook里dept与emp表结构以及数据
用MYSQL 写了一下,将number变成int, to_date去掉即可. DROP TABLE IF EXISTS `dept`; CREATE TABLE `dept` ( `DEPTNO` ) ...
- chosen组件实现下拉框
chosen组件用于增强原生的select控件,使之有更好的用户体验.官方demo https://harvesthq.github.io/chosen/ 目前项目中碰到的使用,比如一个页面中有两个不 ...
- 解决Spine骨骼混合动画错乱问题
Spine是一个很好的制作2D骨骼动画的软件,其中提供的混合(mix)动画功能可以很柔和过度两个不同的动画,但在混合时期,稍有不善,非常容易出现各种错乱.在Spine2D骨骼动画群上,有人提出全K帧. ...
- 自定义滚动条 - mCustomScrollbar
项目中需要使用自定义滚动条,但是试用了很多都功能不够全,今天发现一个比较全而且用法很简单的 -- mCustomScrollbar http://manos.malihu.gr/jquery-cust ...
- OpenCV学习笔记——OpenCV安装
关于OpenCV安装 1.下载和安装OpenCV SDK 在官网:http://opencv.org/上找到OpenCV windows版下载 . 后得到一个 opencv-2.X.X.exe的文件, ...
- Centos 6.5编译安装yum
1.删除redhat原有的yum rpm -aq|grep yum|xargs rpm -e --nodeps 2.下载yum安装文件 wget http://mirrors.163.com/cent ...
- linux学习笔记--vi与vim编辑器
vi编辑器全名为Visual Interface,即为可视化接口,类似于Windows中的记事本 vim相当于是vi的一个升级版本,包含vi的一切操作命令,vim相对于vi做了哪些提升: 1.vim支 ...
- putty+xming远程登录Ubuntu16.04图形界面
前面我写过一篇<Ubuntu16.04 安装ftp服务器传输文件>的文章.文章当中已经可以远程访问linux服务器并且传输文件,然而要在putty中使用开启图形界面的命令到目前为止还是不够 ...