angularjs指令系统系列课程(1):目录
angularjs里面有一套十分强大的指令系统
比如内置指令:ng-app,ng-model,ng-repeat,ng-init,ng-bind等等
从现在开始我们讲解AngularJS自定义指令,
对于指令的命名;在定义时采用驼峰命名比如:helloDirective,
在页面中调用时会按照大写字母用-进行分割,并将大写字母变成小写:hello-directive
先看一个简单的指令:
js
angular.module('app',{}).directive('helloDirective', function() {
return {
template: '<div><span>hello directive</span></div>'
}
});
html:
<section>
<div hello-directive></div>
</section>
运行结果:
审查代码:
我们看下AngularJS里新定义一个指令的完整参数写法:
newsApp.directive('newDirective', function() {
return {
priority: 0, //优先级
template: '',
templateUrl: '', //引入模板链接
replace: false, //替换
transclude: false, //是否保留原有内容
restrict: 'E', // E C A M
controller: '', // or function(){}
scope: false, //true or {}
require: ['?ngModel'],//依赖项
compile: function compile(tElement, tAttrs, transclude) {
return {
pre: function preLink(scope, iElement, iAttrs, controller) { },
post: function postLink(scope, iElement, iAttrs, controller) { }
}
},
link: function postLink(scope, iElement, iAttrs) {
}
}
});
针对指令的这些参数我们进行分布讲解,课程目录:
第一节:目录
第二节:优先级priority,模板template,模板页templateUrl
第三节:替换replace,内容保留transclude,作用方式restrict
第四节:作用域scope
第五节:控制器controller
第六节:依赖项require,ngModel组件
第七节:compile函数
第八节:link函数
angularjs指令系统系列课程(1):目录的更多相关文章
- angularjs指令系统系列课程(5):控制器controller
这一节我们来说一下controller这个参数 一.指令控制器的配置方法: 对于指令我有两种配置路由的方式:1.在html中直接引用,2,在指令的controller参数里定义 第一种:在html中直 ...
- angularjs指令系统系列课程(4):作用域Scope
指令的scope对象是一个很重要,很复杂的对象,我们这一节作为重点讲解 可取值: 1.false(默认), 2.true, 3.{}(object) 1.false:默认值,不创建新的作用域 2.tr ...
- angularjs指令系统系列课程(3):替换replace,内容保留transclude,作用方式restrict
这一节我们主要看一下replace,transclude,restrict这三个参数 1.replace 可取值:bool 默认为:true 对于replace属性,设置为false表示原有指令标识不 ...
- angularjs指令系统系列课程(2):优先级priority,模板template,模板页templateUrl
今天我们先对 priority,template,templateUrl进行学习 1.priority 可取值:int 作用:优先级 一般priority默认为0,数值越大,优先级越高.当一个dom元 ...
- Android官方开发文档Training系列课程中文版:目录
Android官方开发文档Training系列课程中文版:目录 引言 在翻译了一篇安卓的官方文档之后,我觉得应该做一件事情,就是把安卓的整篇训练课程全部翻译成英文,供国内的开发者使用,尤其是入门开 ...
- solr与.net系列课程(九)solr5.1的配置
solr与.net系列课程(九)solr5.1的配置 最近一些园友来咨询solr5.1的配置方式,然后我就去官网下载了个最新版本的solr,发现solr5.0以后solr的下载包里的内容发生的变化,移 ...
- solr与.net系列课程(七)solr主从复制
solr与.net系列课程(七)solr主从复制 既然solr是解决大量数据全文索引的方案,由于高并发的问题,我们就要考虑solr的负载均衡了,solr提供非常简单的主从复制的配置方法,那么下面 ...
- Silverlight for Windows Phone开发系列课程
Silverlight for Windows Phone开发系列课程(1):Windows Phone平台概况 课程简介:本节开始介绍系列课程的概况,包括课程内容,先决条件,学习目的 ...
- 基于DDD的现代ASP.NET开发框架--ABP系列文章总目录
ABP相关岗位招聘:给热爱.NET新技术和ABP框架的朋友带来一个高薪的工作机会 ABP交流会录像视频:ABP架构设计交流群-7月18日上海线下交流会的内容分享(有高清录像视频的链接) 代码自动生成: ...
随机推荐
- Design and Analysis of Algorithms_Fundamentals of the Analysis of Algorithm Efficiency
I collect and make up this pseudocode from the book: <<Introduction to the Design and Analysis ...
- handler发消息的形式
1.onCreate()中写好handler的接受机制,准备接受并处理消息 2.thread中利用handler.post(Runnable r): protected void onCreate(B ...
- 关于java写进mysql中文乱码问题
Eclipse windows-preferences-general-workspace选择为UTF-8 Mysql 创建时选择UTF-8 URL = "jdbc:mysql://12 ...
- Sublime Text3快捷键以及常用插件
工若善其事,必先利其器.做为一个web前端开发人员,必须有一个得心应手的编码工具,本人推荐Sublime Text3和WebStorm,但WebStorm太过智能和耗性能了对初学者来说弊大于利,所以我 ...
- 搭建Android底层开发环境
为了开发linux驱动方便些,我们一般将linux作为Android的开发环境,那么就需要搭建Android的开发环境,下面是一些搭建Android底层时的心得: (1)安装JDK:除了普遍使用的下载 ...
- java的基本数据类型有八种:
1)四种整数类型(byte.short.int.long): byte:8 位,用于表示最小数据单位,如文件中数据,-128~127 short:16 位,很少用,-32768 ~ 327 ...
- 【004: gcc 和 clang 的简单比较】
- 使用sklearn优雅地进行数据挖掘【转】
目录 1 使用sklearn进行数据挖掘 1.1 数据挖掘的步骤 1.2 数据初貌 1.3 关键技术2 并行处理 2.1 整体并行处理 2.2 部分并行处理3 流水线处理4 自动化调参5 持久化6 回 ...
- Extjs swfUpload 多图片上传
一.属性介绍 类型 默认值 描述 upload_url String 处理上传文件的服务器端页面的url地址,可以是绝对地址,也可以是相对地址,当为相对地址时相对的是当前代码所在的文档地址 p ...
- final review 报告
项目名:约跑 组名:nice! 组长:李权 组员:刘芳芳于淼韩媛媛 宫丽君 final Review会议 时间:2016.12.2 代码git的地址:https://git.coding.net/m ...