[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 ...
随机推荐
- hive 添加和删除分区
命令如下: 增加分区 ', p_loctype='MHA'); 删除分区 ALTER TABLE my_partition_test_table DROP IF EXISTS PARTITION (p ...
- Redis-07.Spring Data整合Jedis
Spring整合Jedis 1.单实例(想节约时间的请直接拖到下面跳过1.2部分) step1:毫无疑问,首先需要在pom.xml中配置Jedis依赖 <dependency> <g ...
- CLion之C++框架篇-安装工具，基础框架的搭建（一）
背景 日常学习C++,也就是看看书.在vim里写写代码.在日常项目开发中,也是边看书(一是系统性理解.二是找找有什么更好的代码编写方式)边写代码,会顺带看看别人的代码怎么写的? 日常学 ...
- PostgreSQL查看表、表索引、视图、表结构
-- 表索引select * from pg_indexes where tablename='person_wechat_label';select * from pg_statio_all_ind ...
- 于bugku中游荡意外得到关于CBC翻转攻击思路
个人简介:渣渣一枚,萌新一个,会划水,会喊六六今天在bugku遇到关于CBC翻转攻击的题目,总结了一下关于CBC翻转攻击的原理,以及关于这道题目的解题思路个人博客:https://www.cnblog ...
- FFmpeg 学习(二)：Mac下安装FFmpeg
一.安装ffmpeg 分为两种安装方式: 1. 命令行安装 brew install ffmpeg 2. 下载压缩包安装 去 http://evermeet.cx/ffmpeg/ 下载7z压缩包,解压 ...
- 微信小程序开发用户授权登录
用wx.login获取登录凭证code <!--pages/user/index.wxml--> <view hidden='{{boolean}}'> <view wx ...
- GitHub 近 100,000 程序员“起义”：向“996”开炮！
作者 | 伍杏玲 出品 | 程序人生(ID:coder_life) 平常CSDN推送关于程序员加班的文章时,很多程序员边吐槽边调侃地留言“比拼”:“我们也是996”.“007来报道”…… 可在简单的数 ...
- Kubernetes 笔记 02 demo 初体验
本文首发于我的公众号 Linux云计算网络(id: cloud_dev),专注于干货分享,号内有 10T 书籍和视频资源,后台回复「1024」即可领取,欢迎大家关注,二维码文末可以扫. 从前面的文章我 ...
- odoo开发笔记 -- 表名_name长度限制
场景描述: odoo中定义模型的时候,系统会根据参数_name="********" 按照一定的系统规则自动生成表名; 最近开发过程中发现,_name参数的字符长度不能超过64位, ...