Dyrektywa AngularJs: wywołanie metody z zakresu nadrzędnego w szablonie
Jestem całkiem nowy w dyrektywach Angulara i bardzo trudno mi to zrobić, aby robić to, co chcę. Oto podstawy tego, co mam:
Kontroler:
controller('profileCtrl', function($scope) {
$scope.editing = {
'section1': false,
'section2': false
}
$scope.updateProfile = function() {};
$scope.cancelProfile = function() {};
});
Dyrektywa:
directive('editButton', function() {
return {
restrict: 'E',
templateUrl: 'editbutton.tpl.html',
scope: {
editModel: '=ngEdit'
}
};
});
Szablon (editbutton.tpl.html):
<button
ng-show="!editModel"
ng-click="editModel=true"></button>
<button
ng-show="editModel"
ng-click="updateProfile(); editModel=false"></button>
<button
ng-show="editModel"
ng-click="cancelProfile(); editModel=false"></button>
HTML:
<edit-button ng-edit="editing.section1"></edit-button>
Jeśli nie jest to jasne, chcę, aby tag
& < edit-button & >zawierał trzy różne przyciski, z których każdy współdziała z dowolną właściwością zakresu przekazaną do
ng-edit . Po kliknięciu powinni zmienić tę właściwość, a następnie wywołać odpowiednią metodę zakresu.Jak to się dzieje teraz, kliknięcia przycisków zmieniają poprawnie wartości
$ scope.editing, ale metody
updateProfilei
cancelProfilenie działają. Być może daleko mi do zrozumienia, jak prawidłowo używać dyrektyw, ale trudno mi znaleźć w Internecie przykład, który pomógłby mi osiągnąć to, co próbuję zrobić. Każda pomoc byłaby bardzo mile widziana.
Nie znaleziono powiązanych wyników
Zaproszony:
Aby odpowiedzieć na pytania, Zaloguj się lub Zarejestruj się
1 odpowiedzi
Anonimowy użytkownik
Potwierdzenie od:
Demonstracja
http://plnkr.co/edit/6hlINYjhNzcTSJoWbsDi
Innym sposobem (i prawdopodobnie najlepszym) jest ustawienie zakresu dyrektywy w trybie piaskownicy, tak aby zawierała odniesienia do tych funkcji kontrolera:
Następnie przekazujesz funkcje przez HTML:
Demonstracja
http://plnkr.co/edit/HLqRPIzAz ... eview