Angularjs: Как сделать директиву, которая вызывается после подстановки переменных?

Question

[Егор]

Приветствую всех.

Есть 1 контроллер, 1 директива и html.

В контроллере есть $scope.variable.

Имеется такой html

<div class="description" my-directive>
{{variable}}
</div>

Задача состоит в следующем:

Директива должна посчитать количество символов в $scope.variable и вывести это количество.

Пробую получить в директиве так:

link: function(scope,element){
var text = element.text();
console.log(text);  // в text лежит {{variable}} а нужен сам текст этой переменной
}

Нашел вариант с использованием $timeout с 0 временем. Но мне он как-то не нравится и не кажется надежным. Может кто-то подскажет, как быть?

Answer 1

[Сергей Протько]

angular.module('app')
.directive('myDirective', function () {
    return function (scope, el, attr) {
        scope.$watch('variable', function (text) {
              console.log('$scope.variable = %s', text);
        }
    }
});

а еще лучше воспользоваться изолированными скоупами. Если вам нужно просто вывести количество символов - проще будет это сделать фильтрами.

Comments

[Sergey Romanov]

По мойму директива должна вернуть объект

return {
   restrict: 'EA',
   template: '',
   link: function(scope){}   
}

Но я понял что ты имел в виду.

[Сергей Протько]

@Serhioromano мне было лень писать, и вроде как можно только link функцию вернуть (своего рода синтаксический сахар).

[Sergey Romanov]

@Fesor я этого не знал :) Спасибо.

Answer 2

[Dron Krzh]

Ну так используйте scope.variable

Comments

[Егор]

Каким образом директива получит доступ к scope объекта?
rootScope не подходит.

Или может я чего-то не вкуриваю? ))

[Сергей Протько]

@ByKraB да, скоупы наследуются.

Answer 3

[Sergey Romanov]

А по мойму вообще не надо предавать или вставлять {{variable}} внутри директивы.

jsfiddle.net/asrus2v7