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. HDOJ1312<DFS>

    题意: 给一张图,有墙,有路.问某人从起点开始,最多能走多少个格子. 思路: bfs;<水题> #include<iostream> #include<cstring&g ...

  2. Android ART

    这几天在做一个项目时需要在Android中使用OSGi框架(Apache Felix),于是在一个android 4.4.2 版本系统的某品牌的平板上实验.实验内容很简单:把felix包里的felix ...

  3. 在Servlet(或者Filter，或者Listener)中使用spring的IOC容器

    web.xml中的加载顺序为:listener > filter > servlet > spring. 其中filter的执行顺序是filter-mapping在web.xml中出 ...

  4. Entity Framework Power Tools Beta 3

    http://visualstudiogallery.msdn.microsoft.com/72a60b14-1581-4b9b-89f2-846072eff19d/ PM> Install-P ...

  5. sdf SimpleDateFormat 不是线程安全的，

    我经常用一个public static SimpleDateFormat sdf; 今天发现报“java.lang.NumberFormatException: multiple points”的异常 ...

  6. unity3d之在屏幕上画线

    如何在屏幕上画线,简单的代码如下: using UnityEngine; public class Test : MonoBehaviour { void OnGUI() { GL.LoadOrtho ...

  7. 打印等腰三角形as3

    package { import flash.display.Sprite; public class san extends Sprite { public function san() { var ...

  8. Apache 隐藏入口文件以及防盗链.htaccess 文件

    Apache 隐藏入口文件以及防盗链.htaccess 文件 RewriteEngine on # 隐藏入口文件 RewriteCond %{REQUEST_FILENAME} !-d Rewrite ...

  9. [转] SpringJdbc的几种不同的用法

    转自:http://vsp.iteye.com/blog/1182887 Spring对jdbc做了良好的封装,本人在学习时做了以下几种方式的尝试 首页先来创建一个dao接口 package com. ...

  10. compass scss blueprint

    [转载] 今天在执行compass create my-grid –using blueprint 命令时发现报错 google了一下,说是新版compass已经不包括compass-bluprint ...