Zagnieżdżone dyrektywy - nie można przekazywać argumentów do metody kontrolera z dyrektywy podrzędnej w Angularjs
Mam problemy z zagnieżdżonymi dyrektywami w angularjs. Chcę wywołać metodę kontrolera z dyrektywy w innej dyrektywie i próbuję przekazać do niej argumenty, jednak są one niezdefiniowane.
Próbuję wywołać remove () z trzema argumentami z selected.html poniżej. Działało zanim wprowadziłem dyrektywę nadrzędną (televisionFilter.js). Czy ktoś może zasugerować, co zrobić, aby przekazać je do kontrolera?
Dzięki!
Kod:
controller.js
$scope.remove = function(selectorToRemove, choicesArr, selectedArr){
console.log(selectorToRemove); //undefined
console.log(choicesArr); //undefined
console.log(selectedArr); //undefined
};
televisionFilter.js
angular.module('app.directives').directive('televisionFilter', function(){
return{
restrict: 'A',
templateUrl: 'js/templates/television-filter.html',
scope: {
search: '=',
selectedBrand: '=',
submit: '&',
remove: '&'
}
};
});
selected.js
angular.module('app.directives').directive('selected', function(){
return{
restrict: 'A',
templateUrl: 'js/templates/selected.html',
scope:{
choicesArr: '=',
selectedArr: '=',
remove: '&'
}
};
});
list.html
<div television-filter search='televisionSearch' submit="submit()" selected-brand='selectedBrand' remove='remove(selectorToRemove, choicesArr, selectedArr)'></div>
telewizja-filter.html
<div selected selected-arr='search.selectedBrands' choices-arr='search.brands' remove='remove(selectorToRemove, choicesArr, selectedArr)'>
selected.html
<ul>
<li ng-repeat="selected in selectedArr" class="filter-autocomplete-list" ng-click="remove({selectorToRemove:selected, choicesArr:choicesArr,selectedArr:selectedArr})">
<span class="label label-default label-text">{{selected}}</span>
</li>
</ul>