angular.module('moduleName', []).directive(
'namespaceDirectiveName',
[ function() {
return {
restrict : '',// 描述指令在模版中的使用方式,包括元素E,属性A,CSS样式类,注释或者以上方式的任意主和
priority : 0,// 设置指令在模版中的执行顺序,顺序是相对于其他指令而言
template : '',// 以字符串的形式编写一个内联模版,如果以url的形式提供模版,此属性会被忽略
templateUrl : '',// 描述加载模版所需要的url。如果使用temlate形式提供模版,此属性会被忽略
replace : true,// 如果设置为true则替换指令所在的元素,否则就追加到元素内部
transclude : true,// 把指令元素原来的子节点移动到一个新模版内部
scope : 'bool or object',// 为当前指令创建一个新的作用域,而不是使之继承父作用域
constroller : function($scope, $element, $attrs, $transclude) {
// 创建一个控制器,它会暴露一个API,利用这个API可以在多个指令之间进行通信
},
require : '',// 要求必须存在另个一指令,当前指令才能执行
link : function(scope, iElement, iAttrs) {
// 使用编程的方式修改最终生成的dom元素的实例,添加事件监听器,并设置数据绑定
},
compile : function(tElement, tAttrs, transclude) {
//在使用ng-repeat用编程的方式修改dom模版,从而实现一个指令跨越多个指令的特性。
//也可以返回一个link函数,可以用它来修改产生元素的示例
return {
pre : function preLink(scope, iElement, iAttrs,
controller) {
},
post : function postLink(scope, iElement, iAttrs,
controller) {
} }
}
};
} ]);

Angularjs中编写指令模版的更多相关文章

  1. AngularJS中的指令全面解析(转载)

    说到AngularJS,我们首先想到的大概也就是双向数据绑定和指令系统了,这两者也是AngularJS中最为吸引人的地方.双向数据绑定呢,感觉没什么好说的,那么今天我们就来简单的讨论下AngularJ ...

  2. AngularJS中Directive指令系列 - scope属性的使用

    文章是转的,我做下补充.原文地址:https://segmentfault.com/a/1190000002773689 每当一个指令被创建的时候,都会有这样一个选择,是继承自己的父作用域(一般是外部 ...

  3. AngularJS中的指令

    欢迎大家讨论与指导 : )  前言 当AngularJS中的内置指令不能满足我们的需求,或者当我们需要创建一个能够用于多个AngularJS程序的自包含的功能单元时,我们应该创建自定义指令来满足需求. ...

  4. Angularjs 中使用指令绑定点击事件

    项目中,模板中的菜单是jQuery控制的,在Angularjs中就运行不到了,因为菜单项是ng-repeat之后的. 如html <ul id="main-menu"> ...

  5. 浅谈AngularJS中的指令和指令间的相互通信

    说到AngularJS,我们首先想到的大概也就是双向数据绑定和指令系统了,这两者也是AngularJS中最为吸引人的地方.双向数据绑定呢,感觉没什么好说的,那么今天我们就来简单的讨论下AngularJ ...

  6. angularjs中directive指令与component组件有什么区别?

     壹 ❀ 引 我在前面花了两篇博客分别系统化介绍了angularjs中的directive指令与component组件,当然directive也能实现组件这点毋庸置疑.在了解完两者后,即便我们知道co ...

  7. AngularJS中Directive指令系列 - 基本用法

    参考: https://docs.angularjs.org/api/ng/service/$compile http://www.zouyesheng.com/angular.html Direct ...

  8. angularJS中自定义指令

    学习了angularJS一周,但是大部分时间被自定义指令占用了.博主表示自学互联网好心塞的,发现问题的视觉很狭窄,这比解决问题要更难.这篇文章首先介绍了自定义,然后介绍了在使用自定义指令遇到的问题. ...

  9. angularjs学习之六(angularjs中directive指令的一般编程事件绑定 模板使用等)

    angular js 中模板的使用.事件绑定以及指令与指令之间的交互 相应教学视频地址(需FQ):v=aG8VD0KvUw4">angularjs教学视频 <!doctype h ...

随机推荐

  1. Bzoj 1046: [HAOI2007]上升序列 二分,递推

    1046: [HAOI2007]上升序列 Time Limit: 10 Sec  Memory Limit: 162 MBSubmit: 3671  Solved: 1255[Submit][Stat ...

  2. DAL与数据库类型的对应关系

    MSSQL Server类型 DbType类型 C#类型   MySql类型 DbType类型 C#类型 bit Boolean bool   bit(1) Boolean bool tinyint ...

  3. [LeetCode] 287. Find the Duplicate Number 解题思路

    Given an array nums containing n + 1 integers where each integer is between 1 and n (inclusive), pro ...

  4. JAVA--线程wait()、lnotify()和notifyAll()方法

    join()方法是Thread类的一个方法,而wait().notify().notifyAll()是java.lang.Object类的方法,这意味着,任何一个Java对象(包括线程对象)都有wai ...

  5. JSON AND BSON

    JSON JavaScript Object Notation (JSON) is an open, human and machine-readable standard that facilita ...

  6. ant+svn+tomcat实现项目自动部署

    因工作需要,研究并实现了 ant+svn+tomcat实现项目自动部署,其中参考了下面文章:http://www.cnblogs.com/taoweiji/p/3700915.html jar包需要e ...

  7. jQuery判断页面滚动条滚动方向

    废话不多说,直接上代码 $(window).scroll(function(){ var before = $(window).scrollTop(); $(window).scroll(functi ...

  8. JMeter入门(1):JMeter总体介绍及组件介绍

    一.JMeter概述 JMeter就是一个测试工具,相比于LoadRunner等测试工具,此工具免费,且比较好用,但是前提当然是安装Java环境: JMeter可以做 (1)压力测试及性能测试: (2 ...

  9. 【转】Cannot change version of project facet Dynamic Web Module to 3.1 (Eclipse Maven唯一解决方案)

    If you want to use version 3.1 you need to use the following schema: http://xmlns.jcp.org/xml/ns/jav ...

  10. Java - 推断元音辅音

    随机生成字母, 推断是元音字母还是辅音字母. [0,26) + 偏移量'a'就能够生成小写字母. 代码: //: Main.java import java.util.Random; /** * 推断 ...