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的更多相关文章

  1. AngularJs开发——指令与控制器间的通信

    (原文:http://www.html5jscss.com/controller-between-directive.html) 指令与控制器之间通信,跟控制器间的通信.指令间通信也类似,也是下几种方 ...

  2. angular开发控制器之间的通信

    一.指令与控制器之间通信,无非是以下几种方法: 基于scope继承的方式 基于event传播的方式 service的方式(单例模式) 二.基于scope继承的方式: 最简单的让控制器之间进行通信的方法 ...

  3. AngularJS: 自定义指令与控制器数据交互

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  4. AngularJS进阶(九)控制器controller之间如何通信

    AngularJS控制器controller之间如何通信 注:请点击此处进行充电! angular控制器通信的方式有三种: 1,利用作用域继承的方式.即子控制器继承父控制器中的内容 2,基于事件的方式 ...

  5. angularjs控制器之间的数据共享与通信

    1.可以写一个service服务,从而达到数据和代码的共享; var app=angular.module('app',[]); app.service('ObjectService', [Objec ...

  6. AngularJS中控制器之间通信方法

    在同个angular应用的控制器之间进行通信可以有很多种不同的方式,本文主要讲两种: 基于scope继承的方式和基于event传播的方式 基于scope继承的方式 最简单的让控制器之间进行通信的方法是 ...

  7. angularJS控制器之间的相互通信方式、$broadcast、$emit、$on

    在项目中,我们可能会很经常性的利用到控制器之间的相互通信,在angular中的控制器之间的相互通信有以下几种方式: 1)通过本地数据的存储localstorage,sessionstorage, 2) ...

  8. AngularJS指令进阶 – ngModelController详解

    AngularJS指令进阶 – ngModelController详解 在自定义Angular指令时,其中有一个叫做require的字段,这个字段的作用是用于指令之间的相互交流.举个简单的例子,假如我 ...

  9. angularJS 指令解释

    本文引自 http://blog.csdn.net/kongjiea/article/details/49840035 指令,很重要 AngularJS与jQuery最大的区别在哪里?我认为,表现在数 ...

随机推荐

  1. 在 WinCe 平台读写 ini 文件

    在上篇文章开发 windows mobile 上的今日插件时,我发现 wince 平台上不支持例如 GetPrivateProfileString 等相关 API 函数.在网络上我并没有找到令我满意的 ...

  2. .OpenWrt驱动程序Makefile的分析概述 、驱动程序代码参考、以及测试程序代码参考

    # # # include $(TOPDIR)/rules.mk //一般在 Makefile 的开头 include $(INCLUDE_DIR)/kernel.mk // 文件对于 软件包为内核时 ...

  3. PAT (Advanced Level) 1067. Sort with Swap(0,*) (25)

    只对没有归位的数进行交换. 分两种情况: 如果0在最前面,那么随便拿一个没有归位的数和0交换位置. 如果0不在最前面,那么必然可以归位一个数字,将那个数字归位. 这样模拟一下即可. #include& ...

  4. PHP模板解析类实例

    作者:mckee 这篇文章主要介绍了PHP模板解析类,涉及php针对模板文件的解析与字符串处理的相关技巧,具有一定参考借鉴价值,需要的朋友可以参考下 <?php class template { ...

  5. html5 canvas 实现简单的画图

    今天早上看了一下 canvas 前端画图,数据可视化, 百度的 echart.js  , d3等 js 库都已经提供了强大的绘制各种图形的 API. 下面记录一下 有关canvas 绘图的基本知识: ...

  6. Spark+ECLIPSE+JAVA+MAVEN windows开发环境搭建及入门实例【附详细代码】

    http://blog.csdn.net/xiefu5hh/article/details/51707529 Spark+ECLIPSE+JAVA+MAVEN windows开发环境搭建及入门实例[附 ...

  7. 目前所有的ANN神经网络算法大全

    http://blog.sina.com.cn/s/blog_98238f850102w7ik.html 目前所有的ANN神经网络算法大全 (2016-01-20 10:34:17) 转载▼ 标签: ...

  8. php中serialize、unserialize与json_encode、json_decode比较

    性能比较 同一个变量编码或解码10000次,每个函数执行10000次所需时间 php5.2.13 json : 190 serialize : 257 json_encode : 0.08364200 ...

  9. hibernate---一对一单向外键关联--XML

    Student.java: package com.bjsxt.hibernate; public class Student { private int id; private String nam ...

  10. ibatis一对多 数据库设计及实现

    iBatis的多表关联. ibatis的表关联,和数据库语句无关,是在Java程序中,把若干语句的结果关联到一起.这种关联形式,虽然在大数据量时是很奢侈的行为,但是看起来很干净,用起来也很方便. 这里 ...