--@angularJS--指令与控制器之间较复杂的交互demo2
1、index.html:
<!DOCTYPE HTML>
<html ng-app="app">
<head>
<title>custom-directive</title>
<meta charset="utf-8">
<link rel="stylesheet" href="../css/bootstrap.css">
<script src="../js/angular.js"></script>
<!--<script src="../js/jquery-1.10.2.min.js.js"></script>-->
</head>
<body>
<!-- 下面是指令与控制器交互的demo2. -->
<!-- 这个demo的原理是将方法赋给属性,在js中直接调用属性就等于直接调用方法 -->
<div ng-controller="myCtrl">
<loader loadAttr="loadData()">滑动加载</loader>
</div>
<div ng-controller="myCtrl2">
<loader loadAttr="loadData2()">滑动加载</loader>
</div>
<script src="./directive-controller2.js"></script>
</body>
</html>
2、directive-controller2.js:
var myModule = angular.module("app",[]);
myModule.controller('myCtrl', ['$scope', function($scope){
$scope.loadData=function(){
console.log("正在加载......");
}
}]);
myModule.controller('myCtrl2', ['$scope', function($scope){
$scope.loadData2=function(){
console.log("正在加载222222......");
}
}]);
myModule.directive('loader',function(){
return {
restrict:'AE',
link:function(scope,element,attrs){
element.bind('mouseenter',function(event){
scope.$apply(attrs.loadattr);//属性中的方法的调用非要这样写,注意:不管html中的属性是大写还是小写,这里的属性调用都必须是小写,否则无效
})
}
}
});
--@angularJS--指令与控制器之间较复杂的交互demo2的更多相关文章
- AngularJs开发——指令与控制器间的通信
(原文:http://www.html5jscss.com/controller-between-directive.html) 指令与控制器之间通信,跟控制器间的通信.指令间通信也类似,也是下几种方 ...
- angular开发控制器之间的通信
一.指令与控制器之间通信,无非是以下几种方法: 基于scope继承的方式 基于event传播的方式 service的方式(单例模式) 二.基于scope继承的方式: 最简单的让控制器之间进行通信的方法 ...
- AngularJS: 自定义指令与控制器数据交互
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
- AngularJS进阶(九)控制器controller之间如何通信
AngularJS控制器controller之间如何通信 注:请点击此处进行充电! angular控制器通信的方式有三种: 1,利用作用域继承的方式.即子控制器继承父控制器中的内容 2,基于事件的方式 ...
- angularjs控制器之间的数据共享与通信
1.可以写一个service服务,从而达到数据和代码的共享; var app=angular.module('app',[]); app.service('ObjectService', [Objec ...
- AngularJS中控制器之间通信方法
在同个angular应用的控制器之间进行通信可以有很多种不同的方式,本文主要讲两种: 基于scope继承的方式和基于event传播的方式 基于scope继承的方式 最简单的让控制器之间进行通信的方法是 ...
- angularJS控制器之间的相互通信方式、$broadcast、$emit、$on
在项目中,我们可能会很经常性的利用到控制器之间的相互通信,在angular中的控制器之间的相互通信有以下几种方式: 1)通过本地数据的存储localstorage,sessionstorage, 2) ...
- AngularJS指令进阶 – ngModelController详解
AngularJS指令进阶 – ngModelController详解 在自定义Angular指令时,其中有一个叫做require的字段,这个字段的作用是用于指令之间的相互交流.举个简单的例子,假如我 ...
- angularJS 指令解释
本文引自 http://blog.csdn.net/kongjiea/article/details/49840035 指令,很重要 AngularJS与jQuery最大的区别在哪里?我认为,表现在数 ...
随机推荐
- UIImageView动画
NSMutableArray *arrM = [NSMutableArray array]; // 2.加载所有图片 ; i <= ; i++) { NSString *imageName = ...
- 风格一致的backItem在项目中怎样设置
在相应的navigationController中重写- (void)pushViewController:(UIViewController *)viewController animated:(B ...
- Eclipse中常用的操作单词
Existing Project into Workspace 现有的工程引入工作空间(加载工程)File 文件New 新建Project 工程Folder 文件夹Import 引入(加载&导 ...
- Linux 互斥锁的实现原理(pthread_mutex_t)
本文参考--http://www.bitscn.com/os/linux/201608/725217.html 和http://blog.csdn.net/jianchaolv/article/det ...
- Eclipse 安装插件
Eclipse 安装插件 本文介绍Eclipse插件的安装方法.Eclipse插件的安装方法大体有三种:直接复制.使用link文件,以及使用eclipse自带的图形界面的插件安装方法. AD: 做为当 ...
- LINQ to SQL语句之Union All/Union/Intersect和Top/Bottom和Paging和SqlMethods
我们继续讲解LINQ to SQL语句,这篇我们来讨论Union All/Union/Intersect操作和Top/Bottom操作和Paging操作和SqlMethods操作 . Union Al ...
- bzoj 3879 虚树
题目大意: 给一个字符串,多次询问k个后缀,求它们两两间LCP长度总和 分析: 转化为后缀树,用虚树求 注意: 后缀树中代表后缀的点都是叶子节点 题目中取模并没有卵用 #include <cst ...
- AsParallel 用法
http://www.cnblogs.com/leslies2/archive/2012/02/08/2320914.html AsParallel 通常想要实现并行查询,只需向数据源添加 AsPar ...
- vector与ArrayList、hashmap与hashtable区别
一.vector与ArrayList区别 首先要说明的是vector和arraylist都是list的实现类,都是代表链表的数据结构. java.util.Vector; 类中 pa ...
- linux权限---【600,644,700,755,711,666,777】 - - 博客频道 - CSDN.NET
body { font-family: "Microsoft YaHei UI","Microsoft YaHei",SimSun,"Segoe UI ...