С помощью дополнительных свойств мы можем настроить применение директивы. Рассмотрим два свойства: link и restrict.

Свойство link позволяет задать функцию директивы. А свойство restrict позволяет указать объект, к которому директива будет применяться. Оно может иметь следующие значения:

• E: директива применяется к элементу
• A: директива применяется к атрибуту
• C: директива применяется к классу
• M: директива применяется к комментарию

Данные значения можно комбинировать.
Например, возьмем директиву из прошлой темы и используем выше рассмотренные свойства:

questApp.directive("answerList", function () {
    return {
        link: function (scope, element, attrs) {
 
            var data = scope[attrs["answerList"] ||attrs["source"]];
 
            if (angular.isArray(data.answers)) {
                var divElem = angular.element("<div>").addClass("answers");
                if (element[0].nodeName == "#comment") {
                    element.parent().append(divElem);
                } 
                else {
                    element.append(divElem);
                }
                for (var i = 0; i < data.answers.length; i++) {
                    var answerElem = angular.element('<div>').addClass("answer");
                    var voteElem = angular.element('<div>').addClass("vote");
 
                    var voteUpElem = angular.element('<a>').addClass("vote-up");
                    voteElem.append(voteUpElem);
                    var rateElem = angular.element('<span>').addClass("rate").text(data.answers[i].rate);
                    voteElem.append(rateElem);
                    var voteDownElem = angular.element('<a>').addClass("vote-down");
                    voteElem.append(voteDownElem);
                    answerElem.append(voteElem);
 
                    answerElem.append(angular.element('<b>').text(data.answers[i].text));
                    answerElem.append(angular.element('<p>').text(data.answers[i].author));
                    var iElem =angular.element('<i>').text(data.answers[i].date);
                    var dateElem = angular.element('<p>').append(iElem);
                    answerElem.append(dateElem);
                    divElem.append(answerElem);
                }
            }
        },
        restrict: "EACM"
    }
});

В данном случае директива применяется ко всем четырем типам объектов. Рассмотрим, как применять директиву к отдельным объектам.

Для применения директивы к элементам, нам надо создать соответствующий элемент:

<answer-list source="question" />

Здесь добавлен еще один атрибут - source, который принимает данные для директивы. Тогда в самой директиве нам надо изменить метод получения данных:

var data = scope[attrs["answerList"] ||attrs["source"]];

Преобразуем элемент в следующий:

<div class="answer-list: question"></div>

Код директивы остается тем же.

Комментарий в коде html должен начинаться со слова directive, за которым следует двоеточие, имя директивы и объект, передаваемый в директиву:

<!-- directive: answer-list question -->

Тогда в коде директивы определяются два возможных пути: если директивы применяется к комментарию и остальные случаи

if (element[0].nodeName == "#comment") {
    element.parent().append(divElem);
} 
else {
    element.append(divElem);
}