How to watch property in attrs of directive
Q:
I have a controller that has a counter that changes from time to time.
That counter is tied to an attribute of a directive and read inside the link function of that directive.
How can I have a directive run a function each time that attr value changes?
A:
Inside your corresponding link function: (assuming your attribute is called counter and your scope variable is: scope)
scope.$watch(attrs.counter, function (newTime) {
//do something with the new Time
});
Other way, surely more efficient way:
Interpolating the attribute
Inside your directive, set the scope property as following (it will be isolated so):
scope: { counter: '@'}
The counter would automatically be observed providing the current value as long as the link function is called.
'@' better than '=' here since you I suppose you don't set the counter to a new value in your directive, meaning you just read it. Indeed, = is more useful for two-way data binding but you might not need it.
How to watch property in attrs of directive的更多相关文章
- Directive Definition Object
不知道为什么这个我并没有想翻译过来的欲望,或许我并没有都看熟透,不好误人子弟,原版奉上. Here's an example directive declared with a Directive D ...
- angular directive 深入理解
由于业务的需要,最近angular 的diretive 研究的比较多,有和同事一起共同协作开发scada的项目, 对directive 有了进一步更深的理解. 感觉才开始真正理解了这句话的意思: In ...
- AngularJS的directive(指令)配置选项说明
js代码如下: var appModule = angular.module("appModule", []); appModule.controller("Ctrl&q ...
- directive(指令里的)的compile,pre-link,post-link,link,transclude
The nitty-gritty of compile and link functions inside AngularJS directives The nitty-gritty of comp ...
- AngularJS.directive系列:嵌套directive的通讯及scope研究
一.directive中的scope directive无疑是AngularJS中比较复杂难懂的部分,而directive中个scope更是其中最复杂的部分了,尤其是在嵌套directive中互相通讯 ...
- Angular1.x directive(指令里的)的compile,pre-link,post-link,link,transclude
The nitty-gritty of compile and link functions inside AngularJS directives The nitty-gritty of comp ...
- angular中的compile和link函数
angular中的compile和link函数 前言 这篇文章,我们将通过一个实例来了解 Angular 的 directives (指令)是如何处理的.Angular 是如何在 HTML 中找到这些 ...
- Unity3D 系统宏
Platform Defines The platform defines that Unity supports for your scripts are: Property: Functi ...
- 理解angularjs的作用域
<!doctype html> <html ng-app="myApp"> <head> <script src="http:/ ...
随机推荐
- spring boot: @EnableScheduling开启计划任务支持,@Scheduled计划任务声明
spring boot: @EnableScheduling开启计划任务支持, @Scheduled计划任务声明 package ch2.scheduler2; //日期转换方式 import jav ...
- LeetCode OJ:Path Sum(路径之和)
Given a binary tree and a sum, determine if the tree has a root-to-leaf path such that adding up all ...
- java学习笔记--常用类
一.Math类:针对数学运算进行操作的类 1.常用的方法 A:绝对值 public static int abs(int a) B:向上取整 public static double ceil( ...
- 不能解决,复选框在request对象获取的信息后显示在用户信息里面为中文的选项名
因为方框里面value 不用中文?.? 假如用中文呢? 完全可以!!已经试验 如果不用中文,那么中文可以用对象的参数来获得,即在login.jsp中就要用javabean类属性
- Requests 库
Requests 库的两个重要的对象:(Request , Response) Response对象的属性: import requests r =requests.get('http://www.b ...
- 元素为指针的vector的使用说明
该程序演示了vector中的元素为指针的时候的对对象的操作. /* 功能说明: 元素为指针的vector的使用说明 实现方式: 使用this成员来显示各个对象的地址. 限制条件或者存在的问题: 无 * ...
- 基于BP神经网络的字符识别研究
基于BP神经网络的字符识别研究 原文作者:Andrew Kirillov. http://www.codeproject.com/KB/cs/neural_network_ocr.aspx 摘要:本文 ...
- C# 获取计算机的硬件信息
/// <summary> /// 获得CPU编号 /// </summary> /// <returns></returns> public stri ...
- 备注信息的textarea 和 数据库 text类型
有时候需要用到备注信息 备注一些东西 但是它又不同于普通的输入框,要有换行啊 空格之类的,更有甚者还有其他更多的需求 1.更多需求 用富文本编辑器 2.普通需求 直接用input type=" ...
- (转)更改Web.config中对上传文件大小限制
.net上传超过200K的图片的时候,会跳转到404,但是url没有错误,真J8的坑啊. 本文转载自:http://www.cnblogs.com/zwffff/archive/2009/04/29/ ...