Question

我想创建一个显示更改数据的指令。为简单起见，我想说我想显示当前时间。这意味着一旦指令需要刷新一次。

在the docs中有一个例子就是这种情况（plunkr），但它在程序上更新了指令的内容。我想知道是否可以使用数据绑定来完成。

我想这样的事情：

module.directive('dateTime', function($interval) {
  return {
    scope: { // start with an empty isolated scope
    },

    template: '{{currentTime}}', // display time fetched from isolated scope

    init: function(isolatedScope) {
      $interval(function() {
        isolatedScope.currentTime = new Date(); /* update isolated scope */
      }, 1000);
    },

    destroy: function() { /* stop interval */ }
  };
}

这样的事情可能吗？怎么样？

Answer 1

当然有可能。您在代码中使用的init()函数必须命名为link，并且destroy()函数必须由传递给链接的元素上的$destroy事件上的侦听器替换功能：

module.directive('dateTime', function($interval) {
  return {
    scope: {
    },

    template: '{{currentTime}}',

    link: function(isolatedScope, element) {
      var interval = $interval(function() {
        isolatedScope.currentTime = new Date(); /* update isolated scope */
      }, 1000);

      element.on('$destroy', function() {
        $interval.cancel(interval);
      });
    }
  };
}

工作示例：http://plnkr.co/edit/rjwYZmR4qJ9Jn28d3jXR?p=preview

AngularJS指令：更新隔离范围

1 个答案: