转自：https://www.cnblogs.com/best/tag/Angular/

1.

元素名

<runoob-directive></runoob-directive>

属性

<div runoob-directive></div>

类名

<div class="runoob-directive"></div>

注释

<!-- directive: runoob-directive -->
 
 <html>

 <head>

     <meta charset="utf-8">

     <script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script>

 </head>

 <body ng-app="myApp">

         <runoob-directive></runoob-directive>

       <div class="runoob-directive"></div>

        <script>

             var app =  angular.module('myApp',[]);

            app.directive("runoobDirective",function(){

                return {

                    restrict:"C",

                    template:'<h1>自定义指令</h1>'

                };

            });

         </script>

 </body>

 </html>

restrict 值可以是以下几种:

  • E 作为元素名使用
  • A 作为属性使用
  • C 作为类名使用
  • M 作为注释使用

restrict 默认值为 EA, 即可以通过元素名和属性名来调用指令。

37.创建自定义的指令的限制使用 通过restrict 设置的更多相关文章

  1. angularjs 创建自定义的指令

    创建自定义的指令 除了 AngularJS 内置的指令外,我们还可以创建自定义指令. 你可以使用 .directive 函数来添加自定义的指令. 要调用自定义指令,HTMl 元素上需要添加自定义指令名 ...

  2. 36.创建自定义的指令directive

    转自:https://www.cnblogs.com/best/tag/Angular/ 1. <html> <head> <meta charset="utf ...

  3. 带你走近AngularJS - 创建自定义指令

    带你走近AngularJS系列: 带你走近AngularJS - 基本功能介绍 带你走近AngularJS - 体验指令实例 带你走近AngularJS - 创建自定义指令 ------------- ...

  4. 带你走近AngularJS 之创建自定义指令

    带你走近AngularJS 之创建自定义指令 为什么使用AngularJS 指令? 使用过 AngularJS 的朋友应该最感兴趣的是它的指令.现今市场上的前端框架也只有AngularJS 拥有自定义 ...

  5. VSCode创建自定义代码段

    上一篇:PyCharm创建自定义代码段(JetBrains系列通用) 设置方法 很简单,快速过一下,F1,然后输入snippets 然后选择对应语言 Python案例 内容和使用: { // pref ...

  6. Dockerfile创建自定义Docker镜像以及CMD与ENTRYPOINT指令的比较

    1.概述 创建Docker镜像的方式有三种 docker commit命令:由容器生成镜像: Dockerfile文件+docker build命令: 从本地文件系统导入:OpenVZ的模板. 关于这 ...

  7. AngularJS -- 指令(创建自定义指令)

    点击查看AngularJS系列目录 转载请注明出处:http://www.cnblogs.com/leosx/   什么是指令 注:本指南是针对已经熟悉AngularJS基础知识的开发人员.如果你才刚 ...

  8. 在vue中创建自定义指令

    原文:https://dev.to/ratracegrad/creating-custom-directives-in-vue-58hh 翻译:心上有杨 指令是带有 v- 前缀的特殊属性.指令的作用是 ...

  9. Vue2.0的变化 ，组件模板，生命周期，循环，自定义键盘指令，过滤器

    组件模板: 之前: <template> <h3>我是组件</h3><strong>我是加粗标签</strong> </templat ...

随机推荐

  1. angular-数据库

    <div ng-app="myApp" ng-controller="customersCtrl"> <table> <tr ng ...

  2. 51 nod 1693 水群

    1693 水群 基准时间限制:0.4 秒 空间限制:524288 KB 分值: 160  难度:6级算法题  收藏  关注 总所周知,水群是一件很浪费时间的事,但是其实在水群这件事中,也可以找到一些有 ...

  3. HDU 4828

    其实..这题是<组合数学>的习题中的一道......当初不会..... 想到一个证明: 填入2n个数,把填在上方的数的位置填上+1,下方的填上-1.这样,在序列1....2n的位置,任意前 ...

  4. ZOJ 2836

    求不比M大的可以被集合任一个数整除的数的个数.(容斥原理) #include <iostream> #include <cstdio> #include <algorit ...

  5. 阿里云server部署架构

    近期要上马一个项目,客户要求所有部署到阿里云的server,做了一个阿里云的部署方案. 上图: watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvc21hbGx ...

  6. hdu1281 棋盘游戏 --- 最大匹配

    给一个矩形棋盘,上面有一些空格点,能够放象棋中的"车", 现给出空格的坐标,求最多能够放多少个"车"使他们互不攻击(依据象棋规则,每行每列至多仅仅能放一个), ...

  7. TensorFlow高层次机器学习API (tf.contrib.learn)

    TensorFlow高层次机器学习API (tf.contrib.learn) 1.tf.contrib.learn.datasets.base.load_csv_with_header 加载csv格 ...

  8. 90.bower解决js的依赖管理

    转自:https://blog.csdn.net/u011537073/article/details/52951122 前言一个新的web项目开始,我们总是很自然地去下载需要用到的js类库文件,比如 ...

  9. 适配器模式（Adapter）：类适配器、对象适配器

    适配器模式(Adapter):将一个类的接口转换成客户希望的另外一个接口.A d a p t e r 模式使得原本由于接口不兼容而不能一起工作的那些类可以一起工作. 适用场景: 1.已经存在的类的接口 ...

  10. 阿里云ecs : Couldn't connect to host, port: smtp.aliyun.com, 25; timeout -1;

    上传到服务器后javamail发邮件异常 链接 原来是ECS基于安全考虑,禁用了端口25. 改成465就可以发邮件了. p.setProperty("mail.smtp.socketFact ...