Angularjs：如何传递范围变量指令？ [英] Angularjs: how to pass scope variables to a directive?

问题描述

我试图用指令来创建并添加多个标记到＆LT; D​​IV＆GT; ，如下所示：

I am trying to use directive to create and append several tags to a <div> as shown below:

module.directive('createControl', function(){
  return function(scope, element, attrs){    
    console.log(attrs.createControl); // undefined     
  }                                          
});                                         


<div class="control-group" ng-repeat="(k, v) in selectedControls">
  <div create-control="{{ v.type }}"></div>
</div>

在ATTRS我有这样的结构：

In attrs I have this construction:

$$element: b.fn.b.init[1]
$$observers: Object
$attr: Object
createControl: "date"
style: "margin-right: 15px"
__proto__: Object

但是，当我尝试使用 attrs.createControl 我得到未定义，我不明白为什么。实际的问题：如何范围变量传递给一个指令

But when I try to use attrs.createControl I get undefined and I do not understand why. Actual question: how to pass scope variable to a directive?

推荐答案

阅读属性/观察插值属性的的 指令文档 。在链接阶段的属性尚未设置

Read Attributes/observing interpolated attributes section of the directive docs. During the link phase the attributes haven't been set.

有几种方法，包括使用 ATTRS。$观察或 $超时。

There are several ways including using attrs.$observe or $timeout.

app.directive('createControl', function($timeout){
 return function(scope, element, attrs){
      attrs.$observe('createControl',function(){
        console.log(' type:',attrs.createControl);
         element.text('Directive text, type is: '+attrs.createControl);
      });
  }
}) ;

<大骨节病> 演示

这篇关于Angularjs：如何传递范围变量指令？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！