在transcluded元素中使用指令的隔离范围

我在我的指令中使用了controllerAs语法。在经过一些研究（并通过文档扫描）后，我的理解认为，transclude d元素似乎不会继承隔离范围，因为ng-transclude只是在该指令后面追加了元素（作为兄弟，例如在this question中寻址）。在transcluded元素中使用指令的隔离范围

是否有clean通过其transcluded元素使用我的指令的隔离范围的方法？

出于演示目的，这里有一个plunkr。

来源

2014-10-30 srph

最干净的方法是使用transclude参数link指令的功能，如here (Transclusions and Scopes by Jesus Rodriguez所述。

片段截取从源：

.directive('person', function() { 
    return { 
     restrict: 'EA', 
     scope: { 
      header: '=' 
     }, 
     transclude:true, 
     link: function(scope, element, attrs, ctrl, transclude) { 
      scope.person = { 
       name: 'Directive Joe', 
       profession: 'Scope guy' 
      }; 

      scope.header = 'Directive\'s header'; 
      transclude(scope, function(clone, scope) { 
       element.append(clone); 
      }); 
     } 
    }; 
});

的transclude函数接收功能和一个可选的第一个参数。这个函数做的是克隆transcluded html，然后你可以用它做你想要的。如果您将作用域作为第一个参数，则该作用域将是克隆元素上使用的作用域。 transclude的回调函数将接收克隆的DOM以及附加的范围。

在这种情况下，我们使用指令的父范围（本例中是控制器的范围）作为transcluded html的范围，然后我们在回调函数中接收它。我们在这里做的只是将它附加到我们的指令的DOM元素上。在这种情况下，我们对指令的模板，我们可以检索DOM元素，然后用它来追加transcluded HTML，这就是我所说的完全控制:)

此外，transclude d元素被添加到该指令继承父代的$scope而不是指令的。更多信息可以发现here

来源

2015-01-01 04:07:19 srph

如果我理解正确的，你只需要更改为：

<that obj="dis.obj"> 
    ThatCtrl: {{ dis.obj }} 
</that>

而且，你不需要obj属性：

<that>ThatCtrl: {{ dis.obj }}</that>

来源

2014-10-31 02:16:34 denisazevedo

我试图以最简单的方式重现我的问题。我为此道歉。例如，如果我必须将'dis_obj''传递给指令，因为它是某些方法的API？ – srph 2014-10-31 02:43:37

在transcluded元素中使用指令的隔离范围

回答

相关问题