從transcluded內容訪問指令的隔離範圍

我不確定這是否實際可行，但我基本上想要在AngularJS中'&'隔離範圍的反向。這裏是一個Plunkr來演示。從transcluded內容訪問指令的隔離範圍

基本上，我有一個自定義指令設置，提供了一些可重用的HTML。它使用ng-transclude來允許在其中呈現一些外部內容。但是，我發現了一種情況，我想從代碼的transcluded部分訪問已經在指令的隔離範圍中設置的函數。

所以基本上我有東西，看起來像：

<div ng-controller="MainController"> 

    <!-- The directive --> 
    <div some-custom-directive> 

     <!-- Button 1 that invokes a method within the controller scope --> 
     <button id="button1" ng-click="invoke1()">Invoke from Controller</button> 

     <!-- Button 2 that invokes a method on the isolate scope for the custom directive --> 
     <button id="button2" ng-click="invoke2()">Invoke from Isolate Scope</button> 
    </div> 
</div>

有誰知道，如果這確實是可能的嗎？

更新

按@馬克Rajcok的回答，對$scope發現$$prevSibling可用於從transcluded內容中訪問該指令的分離範圍。但是，我已經更新了上面的Plunkr，以便在ng-repeat指令中嘗試執行此操作，但不起作用。我假設重複中的項目不會繼承範圍。

來源

2013-04-23 Samuel Slade

雖然可能，我提出的解決方案是一個黑客，因爲它使用一個範圍內可變，$$prevSibling。

在您的transcluded內容中，您位於transcluded範圍內。該指令的隔離和transcluded範圍是兄弟姐妹。爲了從橫跨範圍到隔離範圍，您可以使用$$prevSibling。（要從隔離範圍轉換到跨行範圍，可以使用$$nextSibling。）

那麼，這個技巧將工作：

<a href="" ng-click="$$prevSibling.action()">Invoke the Directive Action</a>

要調用的方法在控制範圍內，你需要指定使用&作爲@ganaraj已經證明：

<content-presenter controller-action="action()">

然後在您的指令：

scope: { controllerAction: '&' }, 
template: ... + 
    '<button ng-click="controllerAction()">Trigger Ctrl action()</button>' ...

Plunker

含伍重複（見塞繆爾的評論），每個項目創建transcluded範圍的子範圍。在下面的圖片中，我只顯示一個item以使圖片更小。爲$$ prevSibling反轉$$ nextSibling棕色箭頭。

enter image description here

所以黑客去的方法action()從一個NG重複子範圍分離範圍定義爲

<div ng-repeat="item in items" ng-click="$parent.$$prevSibling.action()">

更新角V1.3 +：

由於Angular v1.3，transcluded作用域現在是該指令的隔離區的一個孩子範圍–他們不再是兄弟姐妹。因此，要從跨越範圍到隔離範圍，請使用$parent。

含伍重複，每個項目還創造了transcluded範圍的子範圍：

enter image description here

但是去法action()從一個NG重複子範圍的分離範圍的定義，我們現在使用

<div ng-repeat="item in items" ng-click="$parent.$parent.action()">

來源

2013-04-23 15:11:24

乾杯，工作。但是，我發現它不能在'ng-repeat'中工作（我假設每個項目都不會從控制器繼承'$ scope'，反正每個項目都可以訪問'$$ prevSibling ''我已經更新了上面的Plunkr來舉個例子 – 2013-04-24 08:39:12

@SamuelSlade，看到我更新的答案（附圖） – 2013-04-25 03:23:44

輝煌，像魅力一樣工作！感謝您的圖表，非常豐富。 – 2013-04-25 09:07:36

這是一個解決您當前問題的方法。我不確定你想要做什麼。但據我所知，沒有辦法在隔離範圍內從外部範圍調用某些東西。當然，你可以在隔離作用域和外部作用域之間設置一個雙向綁定變量，在外部作用域中更改變量，並在隔離作用域中監視它（這將像事件機制一樣工作）......這就是做你正在試圖做的事情的方法..如果你堅持的話。

另外，還有一種機制可以從隔離範圍調用外部作用域上的函數。它有點像回調。

見本http://plnkr.co/edit/5MT4vo9qXtV6nQikfEiH?p=preview

來源

2013-04-23 14:50:18 ganaraj

這是我的理解，加入到ng-repeat元素創建一個新的範圍，爲了使重複的內容要正確綁定。您可能需要在該鏈中附加$parent，例如$parent.$$nextSibling，才能升級到與指令隔離範圍相鄰的級別。

來源

2013-07-02 14:37:22

從transcluded內容訪問指令的隔離範圍

回答

相關問題