В AngularJS вы не можете добавить директивы к своей пользовательской директиве без необходимости выполнять какую-то странную логику $compile
, чтобы зарегистрировать директивы ngClick
. Вероятно, что-то вроде:
// include $compile
// ... append li elements
scope.$apply(function() {
$compile(elem)(scope);
});
Кстати, я понятия не имею, работает ли это, так что не привлекайте меня к ответственности, если это не так. Как правило, вы решаете эту проблему с помощью директивы, которая выглядит следующим образом:
angular.directive('pager', function() {
return {
restrict: 'AEC',
scope: {
numPages: '=pager',
pageFn: '='
},
template: '<ul><li ng-repeat="page in pages" ng-click="executePage(page)">{{page}}</li></ul>',
link: function(scope, elem, attrs) {
scope.pages = [];
scope.$watch('numPages', function(pages) {
if(!pages) return;
scope.pages = [];
for(var i = 1; i <= pages: i++) {
scope.pages.push(i);
}
});
scope.executePage = function(page) {
if(scope.pageFn){
// Additional Logic
scope.pageFn(page);
}
};
}
};
})
Затем в вашем html вы должны написать такую директиву:
<my-directive>
<div pager="numberOfPages" page-fn="goToPage"></div>
</my-directive>
goToPage
— это функция, определенная в директиве myDirective
и принимающая параметр страницы. На данный момент директива пейджинга также достаточно абстрактна, чтобы вы могли использовать ее в нескольких местах, и вам не нужно беспокоиться о внешних функциях.
17.04.2014