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. Noip前的大抱佛脚----Noip真题复习

    Noip前的大抱佛脚----Noip真题复习 Tags: Noip前的大抱佛脚 Noip2010 题目不难,但是三个半小时的话要写四道题还是需要码力,不过按照现在的实力应该不出意外可以AK的. 机器翻 ...

  2. 【转载】COM 组件设计与应用（十七）——持续性

    原文:http://vckbase.com/index.php/wv/1264.html 一.前言 我们写程序,经常需要实现这样的需求: 例一.程序运行产生一个窗口,用户关闭的时候需要记录窗口的位置, ...

  3. 提交到开源git时出现:fatal: refusing to merge unrelated histories的解决办法

    解决办法   创建本地库和fetch远程分支这些前面的步骤这里略过.可以自行百度. 解决办法: 1.cmd进入项目的根目录. 2.执行下面的命令:git pull origin master --al ...

  4. Jenkins + Gitlab + Ansible--playbook 代码上线流程（文末有免费视频）

      jenkins 构建是支持 git 选择分支 安装 Git Parameter 插件在系统管理中的插件管理 然后点击选插件,在右上角输入 Git Parameter,找到 Git Paramete ...

  5. zabbix监控DELL服务器硬件状态

    zabbix监控DELL服务器硬件状态 登录dell服务的管理页面 默认用户名:root 密码:calvin 服务器开放snmp信息,开启完应用 Zabbix服务器导入dell监控硬件模板 验证 sn ...

  6. [Unity Shader] 逐顶点光照和逐片元漫反射光照

    书中的6.4节讲的是漫反射的逐顶点光照和逐片元光照. 前一种算法是根据漫反射公式计算顶点颜色(顶点着色器),对颜色插值(光栅化过程)返回每个像素的颜色值(片元着色器). 第二种算法是获得顶点的法线(顶 ...

  7. Unity摄像机围绕物体旋转两种实现方式

    第一种,使用Transform 函数 RotateAround. 代码如下: public Transform target;//获取旋转目标 private void camerarotate() ...

  8. 32bit 天堂2 windows 2003 server架设教程

    安装环境::[注意:本教程newauth要用不加密的版本] windows 2003 enterprise server 100用户license Microsoft sql server 2000 ...

  9. .NET处理Json的几种方式

    序列化里的xml,soap,binary在上一篇文章里面已经说过了,这篇主要说json. json是目前非常流行的一种序列化数据的方式,很多api都采用的是json,结构简洁,容易理解,适用性强,逐渐 ...

  10. 六大iT公司的组织结构