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. Struts2利用注解实现action跳转

    使用注解来配置Action的最大好处就是可以实现零配置,但是事务都是有利有弊的,使用方便,维护起来就没那么方便了. 要使用注解方式,我们必须添加一个额外包:struts2-convention-plu ...

  2. git第一篇---基本命令

    摘要: (1)用git而不是svn.分布式而不是集中式 (2)名词解释 origin是父目录的意思,master是 一个特殊的分支而已.具体参看做最下边: 1.创建仓库 mkdir git cd gi ...

  3. must override a superclass method

    <properties>        <maven.compiler.encoding>UTF-8</maven.compiler.encoding>       ...

  4. Android JNI入门第六篇——C调用Java

    本篇将介绍在JNI编程中C调用Java实现. 源码下载地址:http://download.csdn.net/detail/xyz_lmn/4868265 关键代码: java: public cla ...

  5. sping 对 hibernate进行事务管理--Annotation, xml, 大多数使用XML

    1. UserServiceTest.java: package com.bjsxt.service; import org.junit.Test; import org.springframewor ...

  6. Ubuntu上CUDA和CUDNN的安装

    Ubuntu上CUDA的安装 下载路径: CUDA下载 `sudo dpkg -i cuda-repo-ubuntu1504-7-5-local_7.5-18_amd64.deb` `sudo apt ...

  7. HDU 3874 Necklace

    莫队算法. #include<cstdio> #include<cstring> #include<cmath> #include<queue> #in ...

  8. Linux Apache2 配置介绍

    转自:http://blog.csdn.net/hursing/article/details/18730813 apache原指http server程序,后来成为了该程序的组织名,所以把原程序名定 ...

  9. [iOS Animation]-CALayer 图层性能

    图层性能 要更快性能,也要做对正确的事情. ——Stephen R. Covey 在第14章『图像IO』讨论如何高效地载入和显示图像,通过视图来避免可能引起动画帧率下降的性能问题.在最后一章,我们将着 ...

  10. Reinstall the Arduino Pro Mini Bootloade ISP(转)

    源:Reinstall the Arduino Pro Mini Bootloade ISP To resolve the errors I burned the bootloader to the ...