在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元素中使用指令的隔離範圍

回答

相關問題