<!DOCTYPE html>
<html lang="en" ng-app="app">
<head>
    <script src="../js/angular.js"></script>
    <meta charset="UTF-8">
    <title>自定义模块</title>
</head>
<body ng-controller="MainCtrl">
    <im-item item="msg" avatar="images/impic.png" avatar-click="aClick(item)"></im-item>
    <script>
        app = angular.module('app', []);

        app.controller('MainCtrl', function ($scope) {
            $scope.msg="fengfeng";
            $scope.aClick=function(item){
                console.log(item);
            }
        });
        app.directive('imItem', function(){
            return {
                restrict: 'E',
                replace:true,
                scope:{
                    item:'=',
                    avatar:'@',
                    avatarClick:'&'
                },
                link:function(scope, el, attrs) {
                    console.dir(scope);
                    console.dir(el);
                    console.dir(attrs);
                    scope.onAvatarClick=function(item){
                        console.log("aa");
                        scope.avatarClick({item:item});
                    }
                },
                template:
                "<div>"+
                    "<img ng-src='{{avatar}}' ng-click='onAvatarClick(item)'>"+
                "</div>"
            }
        });
    </script>
<!--打印顺序  aa fengfeng-->
</body>
</html>

angular-自定义模块的更多相关文章

  1. Angular 自定义模块以及配置路由实现模块懒加载

    项目目录 创建模块 ng g module module/user --routing ng g module module/article --routing ng g module module/ ...

  2. angular（3）服务 --注入---自定义模块--单页面应用

    ng内部,一旦发生值改变操作,如$scope.m=x,就会自动轮询$digest队列,触发指定的$watch,调用其回调函数,然后修改dom树. 干货:https://github.com/xufei ...

  3. angular 自定义指令详解 Directive

    在angular中,Directive,自定义指令的学习,可以更好的理解angular指令的原理,当angular的指令不能满足你的需求的时候,嘿嘿,你就可以来看看这篇文章,自定义自己的指令,可以满足 ...

  4. angular自定义module

    在app.module.ts里面,imports部分,添加你的自定义模块名在你的自定义模块内,添加了component以后,需要添加exports导出,类似下面 import { NgModule } ...

  5. Angular自定义指令（directive）

    angular自定义指令,意我们可以通过angula自己定义指令,来实现我们的特殊要求,为所欲为,一支穿云箭,千军万马来相见 多少年的老规矩了,先看代码: <!DOCTYPE html> ...

  6. 【python】用setup安装自定义模块和包

    python解释器查找module进行加载的时候,查找的目录是存放在sys.path变量中的,sys.path变量中包含文件的当前目录.如果你想使用一个存放在其他目录的脚本,或者是其他系统的脚本,你可 ...

  7. python基础知识8——模块1——自定义模块和第三方开源模块

    模块的认识 模块,用一砣代码实现了某个功能的代码集合. 类似于函数式编程和面向过程编程,函数式编程则完成一个功能,其他代码用来调用即可,提供了代码的重用性和代码间的耦合.而对于一个复杂的功能来,可能需 ...

  8. (02)odoo自定义模块

    * 官方建议模块骨架    --------------------------    addons/<my_module_name>/                 │─ __init ...

  9. Func系列3：自定义模块

    简介 Func自带的模块已经非常丰富,但在日常系统运维当中,尤其是面对大规模的服务器集群.不同类别的业务平台,次是Func自带的模块或许已经不能满足我们的需求,所以有必要通过自定义模块来填补这块的不足 ...

  10. Python3导入自定义模块的3种方式

    前话 最近跟着廖雪峰的教程学到 模块 这一节.关于如何自定义一个模块,如果大家不懂的话还请先看下面这篇博文 ↓ http://www.liaoxuefeng.com/wiki/001431608955 ...

随机推荐

  1. 18.阻止默认操作e.preventDefault();防止冒泡事件：e.stopPropagation()

      一.加了e.preventDefault();会阻止a标签默认的点击跳转效果 <!DOCTYPE html> <html lang="en"> < ...

  2. VUE学习（一）

    1.搭建vue环境 2.了解 v-on  事件监听,常常跟事件(click,mousemove,change等鼠标或者手势事件)在一起,eg:v-on:click,语法糖——:(冒号) 需要在meth ...

  3. Android 连接服务器，并进行相关操作

    1.连接服务器 (1)直接使用WINDOWS自带的远程桌面连接 win+R调出DOS操作窗口,输入mstsc.exe 点击确定,进入如下界面: 点击连接,输入用户名和密码登录,电脑会进入服务器界面.

  4. Android Studio 常用技巧

    1.在控制台输出语句方法 //在控制台输出语句 System.out.println("like"); //方式1 Log.d("002","lind ...

  5. Restrictions.like() 模糊查询,以及使用DetachedCriteria查询的一般用法

    Restrictions.like() 模糊查询,以及使用DetachedCriteria查询的一般用法 2016-10-10 16:52:38                             ...

  6. 危险系数（枚举点+bfs)--------蓝桥备战系列

    标题:危险系数 抗日战争时期,冀中平原的地道战曾发挥重要作用. 地道的多个站点间有通道连接,形成了庞大的网络.但也有隐患,当敌人发现了某个站点后,其它站点间可能因此会失去联系.        我们来定 ...

  7. Go 语言 基础 【第一篇】：package fmt导入

    package  main 解释:只要你 一个可执行 程序

  8. bzoj1076 奖励关 期望dp

    题目传送门 题目大意:总共有k次弹出宝物的机会,宝物共有n种,弹出不同的宝物的概率相同的,是每个宝物都有价值,和选择这个宝物的限制(必须具有特定的宝物),问最后的最优期望是多少. 思路:“正向推概率, ...

  9. webpack 打包css报错 Error: Chunk.entrypoints: Use Chunks.groupsIterable and filter by instanceof Entrypoint instead

    是webpack4和extract-text-webpack-plugin的兼容性问题 执行命令:npm install extract-text-webpack-plugin@next --save ...

  10. phantomjs的和谷歌浏览器的简单使用

    一.phantomjs的简单使用 ''' 什么是phantomJs:无界面的浏览器 ''' from selenium import webdriver from time import sleep ...