Rufen Sie die directive Methode aus dem übersetzten Inhalt auf - javascript, angularjs

Ich versuche, auf eine Methode in einer Direktive durch übersetzten Inhalt zuzugreifen. Mein HTML-Code sieht folgendermaßen aus:

<typeahead class="typeahead" model="customers" filtered-model="customersfiltered" ng-model="selectedcustomer">
<ul>
<li ng-click="select(customer)" ng-repeat="customer in customersfiltered | filter:filter | limitTo:10">
{{customer.firstname}} {{customer.lastname}}
</li>
</ul>
</typeahead>

Und meine AngularJS-Direktive:

directive("typeahead", function ($filter) {
return {
restrict: "E",
transclude: true,
replace: true,
scope: {
model: "=",
filteredModel: "="
},
template: "<div class="typeahead"><form><input type="text" autocomplete="off" class="col-lg-12" ng-model="filter"></form><div ng-transclude></div></div>", //
controller: function($scope){
$scope.filterArray = function(filterString){
$scope.filteredModel=  $filter("filter")($scope.model, filterString);
}

$scope.clear = function(){
$scope.filteredModel = [];
}

$scope.$watch("filter", function(){
if($scope.filter) {
$scope.filterArray($scope.filter);
} else {
$scope.clear();
}
});
},
link: function ($scope, $element, $attributes) {
$scope.select = function(customer){
console.log("dwadad");
}
}
}
})

Das Problem hierbei ist, dass ich nicht auf die select () - Funktion innerhalb der Link-Funktion () vom ng-click-Ereignis des transklusiven Inhalts (Listenelement) zugreifen kann.

Haben Sie eine Idee, wie Sie das lösen können?

Hier ist ein Plunker des aktuellen Codes: Plunker

Antworten:

Ich denke, das kannst du nicht tun Eckige Dokumente:

(...) Der Vorteil der Transklusion ist, dass die Verknüpfungsfunktion a erhält Transclusionsfunktion, die an den richtigen Bereich gebunden ist. In einem Normalerweise erstellt das Widget einen isolierten Bereich, der Transklusion ist kein Kind, sondern ein Geschwister des Isolatbereichs. Diese ermöglicht es dem Widget, einen privaten Status zu haben, und die Transklusion, die an den übergeordneten Bereich (Präisolat) gebunden ist.

Mit anderen Worten, der Geltungsbereich des übertragenen DOMist ein Geschwister, nicht ein Kind des Geltungsbereichs der Direktive. Sie können also nicht von dort darauf zugreifen, und ich denke, das ist richtig. Andernfalls könnten Sie den übermittelten Inhalt nicht an den richtigen Gültigkeitsbereich binden.

Sie können verwenden $$nextSibling:

link: function($scope) {

$scope.$$nextSibling.select = function(customer) {
alert("used isolated scope using $$nextSibling");
}

},