nie dostarcza alertu. Po kliknięciu wewnętrznego szablonu dyrektywy alert nie jest wyświetlany.ng-kliknięcie w wewnętrzny szablon dyrektywy nie zapewnia funkcjonalności
skrzypcach link jest tutaj: http://jsfiddle.net/NNDhX/
Twój dyrektywa ma własną izolowane zakres. Zatem funkcja "cześć" powinna znajdować się w zakresie dyrektywy. Jeśli chcesz przekazać funkcję kontrolera, powinieneś wykonać powiązanie, na przykład scope: { ..., hi: '&' }, a następnie <you-directive hi='hi' ..>. Oto link do dokumentacji na ten temat: Understanding Transclusion and Scopes.
Więc po prostu dodanie go w funkcję łączącą wystarczy:
link: function(scope, element, attrs) {
scope.hi = function() { alert("hi"); }
Tutaj jest aktualizowana skrzypce: http://jsfiddle.net/GwBAh/
Dzięki za rozwiązanie Valentyn Shybanov Ale chcę wywołać funkcję hi() w kontrolerze ...Proszę zaktualizować ten skrzypiec – user1966260
Wymieniłem sposób, w jaki należy wywołać hi z kontrolera: zaktualizuj właściwość scope dyrektywy i połącz ją z funkcją kontrolera. Fiddle z tym rozwiązaniem: http://jsfiddle.net/GwBAh/1/ Nie zapomnij: zakres dyrektywy jest izolowany, więc możesz lub przekazać coś do tego zakresu za pomocą wiązania lub korzystania z transclusion - translatowane lunety są rodzeństwem i nie są odosobniony. –
@ValentynShybanov Należy umieścić to skrzypce w odpowiedzi, aby zaoszczędzić przyszłym czytelnikom jakiś czas. :) A Angular powinno to ułatwić niż wpisywanie niezrozumiałych rzeczy, takich jak 'scope: {func: '&'}'! – Langdon
Cała idea izolować zakresów jest dokładnie, aby uniknąć „dzielenie” rzeczy między rodzicem < -> lunety dla dzieci, w jakiś sposób chroniące je przed ujawnieniem i (nieumyślnie) zmienione przez inne dyrektywy/kontrolery.
Jeśli naprawdę chcesz uniknąć zakresu izolacji i dzielić rodzica zakres, spróbuj tego:
jest usunięcie definicji zawartych w dyrektywie Zakres (skomentowany poniżej):
transclude: true,
/*scope: { title:'@zippyTitle' },*/
następnie umieść atrybuty (attrs) z elementu dyrektywy w zakresie dyrektyw:
scope.attrs = attrs;
Uwaga: W ten sposób właściwość attrs będzie również dostępna w zasięgu nadrzędnym (Ctrl3).
I wreszcie zdefiniować tytuł oparty na scope.attrs
template: '<div>' +
'<div class="title">{{attrs.zippyTitle}}</div>' +
'<div class="body" ng-transclude></div>' +
'<a ng-click="hi();">hi</a>' +
'</div>',
jsFiddle: http://jsfiddle.net/NNDhX/1/
Przyjemna alternatywa, ale nadpisanie właściwości attr scope wydaje się być hakerem. Mogę sobie wyobrazić, że może to sprawić ci kłopoty (zwłaszcza jeśli znajdziesz się za kimś, kto to zrobił). Wydaje się, że lepiej być bardziej konkretnym. – Langdon
Nie wiem, czy jest to najlepszy sposób, ale można użyć $ rodzica w dyrektywie, aby uzyskać dostęp zakres nadrzędny.
<a ng-click="$parent.hi();">parent</a>
Oto Link do pełnego skrzypce przykład: http://jsfiddle.net/EKDse/
funkcja kontrolera wewnątrz dyrektywy musi być wywołana w dołączany bloku. Użycie metody kontrolera w szablonie dyrektywy powoduje, że twoja dyrektywa zależy od kontrolera i jest niepożądanym projektem według jego zależności (kontroler zewnętrzny).
W swojej próbce przenieś kod <a> do bloku zawierającego trans. Wykonana Twój dyrektywa bardziej odizolowane i rozwiązał ten problem:
<div class="zippy" zippy-title="Details: {{title}}...">
{{text}}
<a ng-click="hi();">hi</a>
</div>
I nawet nie patrzeć na pytania, gdzie nie przeszkadza, aby edytować w dół na coś pisał inline w pytaniu. – jpsimons