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的更多相关文章

  1. Directive Definition Object

    不知道为什么这个我并没有想翻译过来的欲望,或许我并没有都看熟透,不好误人子弟,原版奉上. Here's an example directive declared with a Directive D ...

  2. angular directive 深入理解

    由于业务的需要,最近angular 的diretive 研究的比较多,有和同事一起共同协作开发scada的项目, 对directive 有了进一步更深的理解. 感觉才开始真正理解了这句话的意思: In ...

  3. AngularJS的directive(指令)配置选项说明

    js代码如下: var appModule = angular.module("appModule", []); appModule.controller("Ctrl&q ...

  4. directive(指令里的)的compile,pre-link,post-link,link,transclude

    The nitty-gritty of compile and link functions inside AngularJS directives  The nitty-gritty of comp ...

  5. AngularJS.directive系列:嵌套directive的通讯及scope研究

    一.directive中的scope directive无疑是AngularJS中比较复杂难懂的部分,而directive中个scope更是其中最复杂的部分了,尤其是在嵌套directive中互相通讯 ...

  6. 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 ...

  7. angular中的compile和link函数

    angular中的compile和link函数 前言 这篇文章,我们将通过一个实例来了解 Angular 的 directives (指令)是如何处理的.Angular 是如何在 HTML 中找到这些 ...

  8. Unity3D 系统宏

    Platform Defines The platform defines that Unity supports for your scripts are:     Property: Functi ...

  9. 理解angularjs的作用域

    <!doctype html> <html ng-app="myApp"> <head> <script src="http:/ ...

随机推荐

  1. spring boot: @EnableScheduling开启计划任务支持,@Scheduled计划任务声明

    spring boot: @EnableScheduling开启计划任务支持, @Scheduled计划任务声明 package ch2.scheduler2; //日期转换方式 import jav ...

  2. 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 ...

  3. java学习笔记--常用类

    一.Math类:针对数学运算进行操作的类 1.常用的方法 A:绝对值   public static int abs(int a) B:向上取整  public static double ceil( ...

  4. 不能解决,复选框在request对象获取的信息后显示在用户信息里面为中文的选项名

    因为方框里面value 不用中文?.? 假如用中文呢?  完全可以!!已经试验 如果不用中文,那么中文可以用对象的参数来获得,即在login.jsp中就要用javabean类属性

  5. Requests 库

    Requests 库的两个重要的对象:(Request , Response) Response对象的属性: import requests r =requests.get('http://www.b ...

  6. 元素为指针的vector的使用说明

    该程序演示了vector中的元素为指针的时候的对对象的操作. /* 功能说明: 元素为指针的vector的使用说明 实现方式: 使用this成员来显示各个对象的地址. 限制条件或者存在的问题: 无 * ...

  7. 基于BP神经网络的字符识别研究

    基于BP神经网络的字符识别研究 原文作者:Andrew Kirillov. http://www.codeproject.com/KB/cs/neural_network_ocr.aspx 摘要:本文 ...

  8. C# 获取计算机的硬件信息

    /// <summary> /// 获得CPU编号 /// </summary> /// <returns></returns> public stri ...

  9. 备注信息的textarea 和 数据库 text类型

    有时候需要用到备注信息 备注一些东西 但是它又不同于普通的输入框,要有换行啊 空格之类的,更有甚者还有其他更多的需求 1.更多需求 用富文本编辑器 2.普通需求 直接用input type=" ...

  10. (转)更改Web.config中对上传文件大小限制

    .net上传超过200K的图片的时候,会跳转到404,但是url没有错误,真J8的坑啊. 本文转载自:http://www.cnblogs.com/zwffff/archive/2009/04/29/ ...