AngularJS - доступ к ng-click в пользовательской директиве
Я пытаюсь разобраться с директивами, я могу легко использовать функцию шаблона, чтобы выбросить мой HTML, однако, если у меня есть ng-щелчок в моем шаблоне, как я могу получить к нему доступ в функции ссылки?
Моя директива:
app.directive('directiveScroll', function () {
return {
restrict: 'AE',
replace: 'true',
template: '<div class="scroll-btns">' +
'<div class="arrow-left" ng-click="scrollLeft(sectionID)"></div>' +
'<div class="arrow-right" ng-click="scrollRight(sectionID)"></div>' +
'</div>',
link: function(scope, elem, attrs) {
$scope.scrollRight = function () {
console.log("scrollRight clicked");
};
$scope.scrollLeft = function () {
console.log("scrollLeft clicked");
};
}
};
});
Как видите, я добавил $scope.scrollRight
к моему link
Функция, однако при нажатии ничего не появляется в консоли.
Если я размещу:
$scope.scrollRight = function () {
console.log("scrollRight clicked");
};
$scope.scrollLeft = function () {
console.log("scrollLeft clicked");
};
В моем контроллере (и вне моей директивы) это работает как ожидалось.
Любая помощь приветствуется.
2 ответа
Ваша функция ссылки определяется следующим образом:
link: function(scope, elem, attrs) {..}
Однако вы пишете функции на $scope
переменная:
$scope.scrollRight = function () {
console.log("scrollRight clicked");
};
$scope.scrollLeft = function () {
console.log("scrollLeft clicked");
};
В этом случае $scope фактически не внедряется в функцию link (и не может быть вставлен), поэтому link - это просто простая функция с параметрами. Вы должны изменить $scope
в scope
и это должно работать:
scope.scrollRight = function () {
console.log("scrollRight clicked");
};
scope.scrollLeft = function () {
console.log("scrollLeft clicked");
};
Вы уверены, что параметр функции ссылки назван scope
не $scope
?