<!DOCTYPE html>
<html ng-app="myApp">
<head lang="en">
  <meta charset="UTF-8">
  <script src="js/angular.js"></script>
  <title></title>
</head>
<body>

<div ng-controller="myCtrl">
</div>
<!--调用指令，并通过属性传参-->
<ts-directive ts-name="Hello World"></ts-directive>

<script>
  var app = angular.module('myApp', ['ng']);
  //创建指令
  app.directive('tsDirective', function () {
    return{
      template:'<h1>{{tsName}}</h1>',
      scope:{
        tsName:'@'//@取ts-name属性对应的值
      }
    }
  })

  app.controller('myCtrl', function () {
    console.log('myCtrl  func is called');
  })
</script>
</body>
</html>

Angular 自定义指令传参的更多相关文章

  1. angular 自定义指令详解 Directive

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

  2. Angular自定义指令（directive）

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

  3. datasnap远程方法支持自定义对象传参

    有同仁需要远程方法传输自定义的数据类型,他以为要自己写代码会很复杂,其实DATASNAP早就为我们想到了. datasnap的数据序列和还原真是无与伦比的强大,其远程方法支持自定义对象传参,DATAS ...

  4. angularjs 指令传参规则

    angularjs 指令传参规则 xx-,data- 驼峰

  5. angular 自定义指令 directive transclude 理解

    项目中断断续续的用了下angular,也没狠下心 认真的学习.angular 特别是自定义指令这块 空白. transclude 定义是否将当前元素的内容转移到模板中.看解释有点抽象. 看解释有点抽象 ...

  6. Angular自定义指令directive:scope属性

    在AngularJS中,除了内置指令如ng-click等,我们还可以自定义指令.自定义指令,是为了扩展DOM元素的功能.代码中,通过指定directive中的restrict属性,来决定这个指令是作为 ...

  7. Angular17 Angular自定义指令

    1 什么是HTML HTML文档就是一个纯文本文件,该文件包含了HTML元素.CSS样式以及JavaScript代码:HTML元素是由标签呈现,浏览器会为每个标签创建带有属性的DOM对象,浏览器通过渲 ...

  8. angular自定义指令

    1.在directive文件下创建指令的js文件 通常自定义指令需要声明模块(注意定义指令时, js内部指令名称需采用 aaAaBb驼峰的命名方式  html中使用的是aa-aa-bb) e.g (f ...

  9. angular -- 自定义指令和模板

    angular 可以自定义一些指令,来简化我们前端的工作量. 第一种:简单指令示例: <h3>自定义指令</h3> <sheng></sheng> &l ...

随机推荐

  1. 设计模式のAdapterPattern（适配器模式）----结构模式

    一.产生背景 这种模式涉及到一个单一的类,该类负责加入独立的或不兼容的接口功能.举个真实的例子,读卡器是作为内存卡和笔记本之间的适配器.您将内存卡插入读卡器,再将读卡器插入笔记本,这样就可以通过笔记本 ...

  2. 如何征服面试官，拿到Offer [转]

    转自 https://my.oschina.net/cccyb/blog/3012768 又到了茶余饭后的时间,想想写点什么,掐指一算,噢呦,快到3月份了,职场的金三银四跳槽季又来了,不同的是今年比往 ...

  3. [CQOI2018]九连环

    嘟嘟嘟 对于这种找规律的题,我向来是不会的. 通过大佬们的各种打表找规律.神奇dp等方法,我们得到了答案就是\(\lfloor \frac{2 ^ {n + 1}}{3} \rfloor\). 高精是 ...

  4. 使用Nginx实现反向代理

    一.代理服务器 1.什么是代理服务器 代理服务器,客户机在发送请求时,不会直接发送给目的主机,而是先发送给代理服务器,代理服务接受客户机请求之后,再向主机发出,并接收目的主机返回的数据,存放在代理服务 ...

  5. day1 计算机组成、操作系统

    一:编程与编程的目的 1.什么是语言?什么是编程语言? 语言是一个事物与另一个事物沟通的介质. 编程语言是程序员与计算机沟通的介质. 2.什么是编程?为什么要编程? 编程是程序员将自己想要让计算机做的 ...

  6. mysql安装-CentOS6下解压安装mysql-5.7.20-linux-glibc2.12-x86_64.tar.gz

    删除已经安装版本 yum list installed mysql [root@localhost ~]# yum list installed mysql Loaded plugins: faste ...

  7. [Spark][Python][Application]非交互式运行Spark Application 的例子

    非交互式运行Spark Application 的例子 $ cat Count.py import sys from pyspark import SparkContext if __name__ = ...

  8. 网盘直链工具 winform版 V1.0

    软件需要.net2.0支持 win7及以上版本用户无需安装 xp用户需要安装 支持网盘:好盘 坚果云 百度云 乐视云 华为网盘 微云 新浪网盘 126disk 速度盘 乐齐盘 天空网盘 千脑网盘 可乐 ...

  9. iOS开发简记（9）：APPStore审核

    "觅知音"这个APP的第一个版本从提交审核到上架,历时三个星期,其中遇到一些审核上的问题,它的处理或许能帮助到遇到同样问题的小伙伴们,所以这里列举出来,这三个星期如何跟苹果的审核团 ...

  10. Python全栈开发之路 【第六篇】：Python基础之常用模块

    本节内容 模块分类: 好处: 标准库: help("modules") 查看所有python自带模块列表 第三方开源模块: 自定义模块: 模块调用: import module f ...