0
<box>a</box>
<box>b</box>
<box>c</box>

Как правильно создать директиву для box, чтобы при клике выводился индекс элемента?

Попытка:

var app = angular.module('app', []);
var indexCtrl = function($scope) {
    $scope.boxes = 0;
};
indexCtrl.$injector = ['$scope'];

app.directive('box', function() {
    return {
        restrict: 'E',
        link: function(scope, element, attrs) {
            attrs.$set('ng-click','alert(index)');
            attrs.$set('index', scope.boxes);
            scope.boxes++;
        }
    };
});
app.controller('indexCtrl', indexCtrl);

В конечном итоге я получаю свой <box ng-click="alert(index)" index="0">a</box> но при нажатии ничего не происходит.

1 ответ 1

1

Добавленные в функции link атрибуты уже не будут интерпретироваться в angular. В версии angular 1.2 можно было бы добавить их в template и использовать опцию replace: true. В версии 1.3+ опции replace больше нет, поэтому вам остается либо добавить ng-click на вложенный в box элемент, либо подписаться на событие вручную:

 app.directive('box', function() {
     return {
        restrict: 'E',
        link: function(scope, element, attrs) {
           element.on('click', function() {
               alert(attrs.index);
           });
        }
    };
});

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими условиями использования и подтверждаете, что прочитали и поняли наши политику конфиденциальности и нормы поведения.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.