[angularjs] angularjs系列笔记（二）指令
重复HTML元素
ng-repeat指令可以重复HTML元素
<body>
<div ng-app="Home" ng-controller="index">
<p ng-repeat="x in names">{{x.name}}</p>
</div> </body> <script type="text/javascript">
//实例化应用对象，参数：模块名，空数组
var app=angular.module("Home",[]);
//调用应用对象的controller()方法，参数：控制器名，回调函数
app.controller("index",function($scope){
$scope.names=[{name:'tsh'},{name:'tsh1'}];
})
</script>
创建自定义指令
使用.directive()函数来自定义指令，要调用自定义指令，html元素上需要添加自定义指令名，使用驼峰法来命名一个指令
限制使用，默认是元素名调用和属性调用
<body>
<div ng-app="Home">
元素名调用
<tsh></tsh>
属性调用
<div tsh></div>
类名调用
<div class="tsh"></div>
</div> </body> <script type="text/javascript">
//实例化应用对象，参数：模块名，空数组
var app=angular.module("Home",[]);
//调用应用对象的directive()方法，参数：指令名，回调函数，返回一个对象
app.directive("tsh",function(){
return {
template:"<p>我是自定义指令</p>"
}
});
</script>
[angularjs] angularjs系列笔记（二）指令的更多相关文章
- angularjs学习第六天笔记（指令简介学习）
您好,由于周末有事情,没哟学习angularjs,几天晚上开始继续学习angularjs,坚持加油每一天.谢谢 接着上周五学习了表单验证以后,今天开始学习angularjs中一个非常重要的模块:指令 ...
- AngularJS学习笔记二:AngularJS指令
AngularJS 指令: AngularJS 通过被称为 指令 的新属性来扩展 HTML. AngularJS 指令是扩展的 HTML 属性,带有前缀 ng-. 几个常用 指令: ng-app 指令 ...
- Mastering Web Application Development with AngularJS 读书笔记(二)
第一章笔记 (二) 一.scopes的层级和事件系统(the eventing system) 在层级中管理的scopes可以被用做事件总线.AngularJS 允许我们去传播已经命名的事件用一种有效 ...
- AngularJS笔记--自定义指令
在前端开发中, 我们会遇到很多地方都会用到同一种类型的控件.AngularJS提供了自定义指令功能,我们可以在指令里面定义特定的html模板.提供给前台html调用. 一. 指令的简单定义. 下面定 ...
- AngularJS学习笔记(二)
一.AngularJS Select(选择框) 1.使用 ng-options 创建选择框 <div ng-app="myApp" ng-controller="m ...
- AngularJS的学习笔记（二）
只给自己看的. AngularJS 表达式 angularjs 使用表达式将数据绑定到html中. AngularJS 表达式写在双大括号内:{{ expression }}. AngularJS 表 ...
- [angularjs] angularjs系列笔记（一）简介
Angularjs通过新的属性和表达式扩展了html Andularjs 可以构建一个单一页面的应用程序(SPAS SinglePageApplications) Angularjs通过指令扩展了ht ...
- AngularJS 二 指令介绍
初始化AngularJS框架 ng-app指令: 在NG-程序指令是AngularJS应用程序的起点.它自动初始化AngularJS框架.AngularJS框架将在加载整个文档之后首先检查HTML文档 ...
- AngularJS的学习笔记（一）
声明:单纯作为我自己的学习笔记,纯是为了自己学习,上面的话都是从各处粘贴,如有冒犯,请原谅我这个小菜鸟~ AngularJS使用了不同的方法,它尝试去补足HTML本身在构建应用方面的缺陷. 使用双大括 ...
- angularjs自动化测试系列之jasmine
angularjs自动化测试系列之jasmine jasmine参考 html <!DOCTYPE html> <html lang="en"> <h ...
随机推荐
- JavaScript 中的正则表达式
1.正则表达式概述 ECMAScript 3 开始支持正则表达式,其语法和 Perl 语法很类似,一个完整的正则表达式结构如下: 1 var expression = / pattern / flag ...
- Android-Java-普通类与抽象类(覆盖)&方法重载
覆盖都是子类与父类之间 & 接口与实现类之间 才会产生:覆盖 有很多名称,覆盖,复写,重写 都是一个意思: 注意:重载都是方法之间 方法同名 不同参数,就属于重载: 普通类-覆盖: 描述An ...
- 最容易理解的对卷积(convolution)的解释
啰嗦开场白 读本科期间,信号与系统里面经常讲到卷积(convolution),自动控制原理里面也会经常有提到卷积.硕士期间又学了线性系统理论与数字信号处理,里面也是各种大把大把卷积的概念.至于最近大火 ...
- 每天学点SpringCloud（二）：服务注册与发现Eureka
相信看过 每天学点SpringCloud(一):简单服务提供者消费者调用的同学都发现了,在最后消费者调用提供者的时候把提供者的地址硬编码在了代码中,这样的方式肯定是不行的,今天,我们就是要Eureka ...
- 图片处理服务 ImageMagick 的安装和使用
简介 该文章使用目前官方最新版本7.0.8,这里只记录下Windows系统下的安装. 官方网站:http://www.imagemagick.org/script/index.php. ImageMa ...
- linux系统下查看图片尺寸的命令
1.首先需要安装:imagemagick,即: # apt-get install imagemagick 2.用 identify 命令查询对应图片的信息,即: # identify logo.jp ...
- python基础-循环语句(5)
一.循环语句介绍 一般情况下,需要多次重复执行的代码,都可以用循环的方式来完成 循环不是必须要使用的,但是为了提高代码的重复使用率,所以有经验的开发者都会采用循环 二.常见的循环形式 while循环 ...
- LockSupport浅析
最初想有没有必要写这类文章,网上相关的文章很多,有些更为透彻,自己再写一篇不免有重复造轮子的感觉. 但想想写文除了分享知识外也可以帮助自己总结归纳,也稍稍可以提高点自我满足感. 基本的线程阻塞原语,被 ...
- 实现quartz定时器及quartz定时器原理介绍
今天研究定时器,在网上看了一篇不错的文章,推荐给大家! 实现quartz定时器及quartz定时器原理介绍
- 《CLR Via C#》读书笔记：26.线程基础
一.线程开销 操作系统创建线程是有代价的,其主要开销在下面列举出来了. 内存开销 线程内核对象 拥有线程描述属性与线程上下文,线程上下文占用的内存空间为 x86 架构 占用 700 字节.x64 架构 ...