index.html:

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

</head>

<body>

<div ng-app="myApp">

    <custom-tags>122</custom-tags>

    <div class="custom-tags">

    </div>

    <div custom-tags>

    </div>

    <!--directive:custom-tags-->

</div>

<script type="text/javascript" src="../../vendor/angular/angularJs.js"></script>

<script type="text/javascript" src="app/index.js"></script>

<script>

</script>

</body>

</html>

　　index.js:

var myApp = angular.module('myApp', [],['$compileProvider',function ($compileProvider) {

    $compileProvider.directive('customTags',function () {

        return {

            //E:element C:class属性 A:attribute M:代表注释

            restrict:"ECAM",//限制约束条件

            //替换

            template:'<div>custom-tags-html</div>',

            replace:true  //如果此配置为true则替换指令所在的元素 如果为false或者不指定 则把当前指令追加到所在元素的内部

        }

    })

}])

　　运行结果：

angularJS1笔记-(9)-自定义指令(restrict/template/replace)的更多相关文章

  1. angularJS1笔记-(11)-自定义指令(transclude/priority/terminal)

    自定义指令的属性 transclude:为true时,允许把html中新定义的指令中原来的dom运用到该指令的template中. 属性priority,设置该指令的优先级,优先级大的先执行,默认指令 ...

  2. angularJS1笔记-(15)-自定义指令(accordion伸缩菜单原始实现)

    index.html: <!DOCTYPE html> <html lang="en"> <head> <meta charset=&qu ...

  3. angularJS1笔记-(14)-自定义指令(scope)

    index.html: <!DOCTYPE html> <html lang="en"> <head> <meta charset=&qu ...

  4. angularJS1笔记-(13)-自定义指令(controller和controllerAs实现通信)

    index.html: <!DOCTYPE html> <html lang="en"> <head> <meta charset=&qu ...

  5. angularJS1笔记-(12)-自定义指令(compile/link)

    index.html: <!DOCTYPE html> <html lang="en"> <head> <meta charset=&qu ...

  6. angularJS1笔记-(10)-自定义指令(templateUrl属性)

    index.html: <!DOCTYPE html> <html lang="en"> <head> <meta charset=&qu ...

  7. angular学习笔记(三十)-指令(2)-restrice,replace,template

    本篇主要讲解指令中的 restrict属性, replace属性, template属性 这三个属性 一. restrict: 字符串.定义指令在视图中的使用方式,一共有四种使用方式: 1. 元素: ...

  8. AngularJs学习笔记3——自定义指令

    指令 概述: 前面也说过一些常用指令,用于快速入门.现在详细总结一下:指令用于实现各种页面的操作,是对于底层DOM操作的封装,扩展了HTML的行为,实现页面交互以及数据绑定. 指令是一种执行的信号,一 ...

  9. AngularJS学习笔记(四) 自定义指令

    指令(directive)是啥?简单来说就是实现一定功能的XXX...之前一直用的ng-model,ng-click等等都是指令.当我有一个ng没提供的需求的时候,就可以自定义个指令.指令的好处显而易 ...

随机推荐

  1. 通过yum安装MySQL5.7.4

    1,进入yum的repo文件夹 cd /etc/yum.repos.d 2,mysql主页已经提供了centos等系统需要的rpm文件,直接去主页下载. 我用的centos6.5,选择Red Hat ...

  2. 生死系列--fuding

    fuding是我们村上的人,比我大十几岁的样子,长的浓眉大眼,相貌很不错,说话声音深厚.当兵转业后留在武汉,取了老婆听说是本地大官的女儿,他们又生了一个女儿,一家经济实力不错. 我们互相见面一般是在春 ...

  3. JavaEE笔记（三）

    缓存是通过map储存的     hibernate中一对一关系配置 // 如果A中有B 或者B中有A,那么为单项关联 // 如果A和B互有,那么为双向关联(最常用) class A{ private ...

  4. jQuery学习- 位置选择器

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  5. 【转载】MFC怎么封装CreateWindow

    原文:http://blog.csdn.net/weiwenhp/article/details/8796337 我们知道Win32中创建一个窗口的流程就是先注册一个WNDCLASSEX(指定了窗口的 ...

  6. [COCI2009]Dvapravca 计算几何

    [COCI2009]Dvapravca LG传送门 先给出考场上的\(O(n^3)\)乱搞方法:枚举一个蓝点和一个红点,找出过着两个点的直线,再枚举蓝点找出这条直线最多能往两边扩展多宽,最后枚举红点计 ...

  7. 洛谷 P4478 [BJWC2018]上学路线

    洛谷 P4478 [BJWC2018]上学路线 原题 神仙题orz,竟然没有1A....容斥+卢卡斯+crt?? 首先用容斥做,记\(f[i][0/1]\)表示到i号点经过了奇数/偶数个点的方案数,因 ...

  8. git删除所有提交历史记录

    这种方式是最快最有效的 进项目根目录启动git bash,然后执行这些即可 最后的 git push -f origin master 会失败,直接在idea里push就能成功了 .Checkout ...

  9. [BZOJ4476][JSOI2015]送礼物[分数规划+单调队列]

    题意 题目链接 分析 分数规划之后可以得到式子:\(max-min-r*mid+l*mid\geq k*mid\) . 贪心选择,肯定区间的端点是极小或者极大值.特殊处理区间长度 \(\leq L\) ...

  10. [转载]在Windows下为PHP5.6安装redis扩展和memcached扩展

    一.php安装redis扩展   1.使用phpinfo()函数查看PHP的版本信息,这会决定扩展文件版本       2.根据PHP版本号,编译器版本号和CPU架构, 选择php_redis-2.2 ...