新项目组使用完善的angularMVVM设计思路架构,很庆幸能够来到这个项目组,在这里的每一天都能够学习到新的知识,为了防止以后忘记,记录一下个人的理解

首先接触最多的是directive,directive目前用到了以下几个属性, restrict,scope,link,templateUrl

首先是restrict:这个无需多说,用来定义自定义指令的使用形式,包括A属性,E标签,C是class,M是备注,最常用的就是EA,尤其是E可以在标签中使用自定义属性传参给父controller,或者定义回调函数等

temolateUrl:可以自定义一个模板文件,并将其在项目中的位置写在此处,这样就可以把需要展现的html格式传给这个自定义 指令并在使用的位置插入。

scope:该属性可以创建一个隔离的作用域,在这个作用域中的$scope与其他指令及controller中的scope是互相独立的,同时你也可以通过@,=和&来绑定一个变量,这个变量会和指令外层的controller进行双向数据绑定,无论那边有变动都会实时更新

@:为单向绑定,会将值得变动告诉外面调用该值的对象,=是双向数据绑定,&是绑定一个函数,外层可以通过调用这个函数来传递参数或方法。

如:

同时在外层的controller中如下使用:

link:简单理解为改指令自己的controller控制器,在其中可以编写控制这个指令页面元素的js代码。其中,可以为其传入$scope和el,前者是改指令的scope对象,后者为改指令元素本身,如上面图片中就是filter-infos标签,包括其中的class,attr等

angularJs工作日记-自定义指令Directive01的更多相关文章

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

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

  2. 【AngularJS】—— 8 自定义指令

    AngularJS支持用户自定义标签属性,在不需要使用DOM节点操作的情况下,添加自定义的内容. 前面提到AngularJS的四大特性: 1 MVC 2 模块化 3 指令 4 双向数据绑定 下面将会介 ...

  3. AngularJs 第一个自定义指令编写

    公司在做一个OA系统, 包括移动端(从微信企业号进入OA系统),电脑端. 电脑端还是用的传统的easyui做界面,asp.net mvc作为服务端.这个技术已经很成熟了配合权限框架很快就能开发出来.但 ...

  4. 20170831工作日记--自定义View学习

    学习了LayoutInflater的原理分析.视图的绘制流程.视图的状态及重绘等知识,按类型来划分的话,自定义View的实现方式大概可以分为三种,自绘控件.组合控件.以及继承控件.那么下面我们就来依次 ...

  5. 走进AngularJs(五)自定义指令----(下)

    自定义指令学习有段时间了,学了些纸上谈兵的东西,还没有真正的写个指令出来呢...所以,随着学习的接近尾声,本篇除了介绍剩余的几个参数外,还将动手结合使用各参数,写个真正能用的指令出来玩玩. 我们在自定 ...

  6. 走进AngularJs(三)自定义指令-----(上)

    一.有感而发的一些话 在学习ng之前有听前辈说过,angular上手比较难,初学者可能不太适应其语法以及思想.随着对ng探索的一步步深入,也确实感觉到了这一点,尤其是框架内部的某些执行机制,其复杂程度 ...

  7. AngularJS:如何使用自定义指令来取代ng-repeat

    引言 本文主要介绍了另一种即具有与ng-repeat 一样处理大量数据的绑定的功能,又具有超高的性能. 对于处理小数量,ng-repeat是非常有用的,但是如果需要处理非常大的数量集,还是采用自定义的 ...

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

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

  9. AngularJS高级程序设计读书笔记 -- 指令篇 之 自定义指令

    2. 自定义指令(15-17 章) Module.directive(name, factory) 2.1 创建自定义指令的方法 Module.directive(name, factory) 示例 ...

随机推荐

  1. SparkContext的初始化过程分析(源码)

     SparkContext的构造函数中,最重要的入参是SparkConf  根据初始化入参生成SparkConf 再根据SparkConf来创建SparkEnv TaskScheduler.start ...

  2. db2 identity列重置,reset/restart

    db2中可以对表中的某一个列创建identity列,用于自动填充值,某些情况下(比如删除数据后,需要从最小值开始,并不重复,那可以对标识列进行reset操作) 语法: ALTER TABLE < ...

  3. oracle启动

  4. Creating custom datatypes using the umbraco usercontrol wrapper

    本篇文章介绍的是基于UmbracoCMS技术搭建的网站所使用的相关技术. 1.      需求 Umbraco CMS的dataType中有richTexhEditor控件,但是它不是太完善,比如没有 ...

  5. android82 启动Actvity和Activity的生命周期

    package com.itheima.jump; import android.net.Uri; import android.os.Bundle; import android.app.Activ ...

  6. 用NodeJs实现延迟调用,规避定时任务的闭包问题

    很多人在用NodeJs的setTimeout(callback, delay[, arg][, ...])编写定时任务时,习惯上直接操作callback外部的对象object(闭包的特点).这样做有一 ...

  7. java输入输出流小细节

    package System; public class Systemdemo { public static void main(String args[]){ demo1(); demo2(); ...

  8. android线程与线程池-----AsyncTask(一)《android开发艺术与探索》

    线程在android是个重要的概念,从用途上讲,线程分为主线程和子线程,主线程负责页面相关,子线程负责耗时操作. 在android中除了Thread本身还有 AsyncTask  IntentServ ...

  9. iOS 网络编程:socket

    @import url(http://i.cnblogs.com/Load.ashx?type=style&file=SyntaxHighlighter.css);@import url(/c ...

  10. VS2015+TFS2015源代码管理

    使用Visual Studio连接TFS