Относительно новый для angularjs. Помоги мне понять, что здесь происходит!

Что я в конечном итоге пытаюсь выполнить: учитывая блок текста в моем html (скажем, в элементе абзаца), я хочу динамически добавлять всплывающие подсказки (точнее, подсказки при начальной загрузке) к выбранным словам в тексте. Так, например, если пользователь вводит мир «привет» в поле поиска, все экземпляры «привет» в абзаце будут отображать всплывающую подсказку при наведении курсора, отображая какое-либо сообщение, например определение или что-то в этом роде.

Примечание: я не думаю, что я был ясен по этому вопросу изначально, но блок текста, к которому я хочу добавить всплывающую подсказку, уже находится в html и не будет иметь какой-либо разметки директивы-тега, окружающей его. См мойиграть на скрипке для иллюстрации.

Я сделал это в jQuery ... теперь я пытаюсь заставить его работать в angularjs!

Моей первой попыткой было использование пользовательского фильтра с регулярным выражением, который вставит тег «a» с атрибутами всплывающей подсказки в абзац в соответствующих местах. Новая разметка появляется, но кажется, что angularjs ее «не видит» (пока не совсем уверен в терминологии, но я думаю, что она не «связывается» ??).

Вот проблема, проиллюстрированная на jsfiddle:

http://jsfiddle.net/petersg5/pF33a/2/

(1) В первой строке вывода есть рабочая всплывающая подсказка о «foo» ... она просто имеет атрибуты всплывающей подсказки непосредственно в разметке. Сгенерированный HTML:

<a href="#" tooltip-placement="top" tooltip="basic tooltip" class="ng-scope">foo</a>

(2) Вторая строка использует ng-bind-html и имеет атрибуты, но не рабочую подсказку. Сгенерированный HTML:

<a href="#" tooltip-placement="top" tooltip="tooltip via ng-bind-html">foo</a>

(3) Третья строка использует фильтр и имеет атрибуты, но не рабочую подсказку. Сгенерированный HTML:

<a href="#" tooltip-placement="top" tooltip="tooltip via filter">foo</a>

Мой главный вопрос ... как решить задачу, которую я описал выше?

Вторичный вопрос касается понимания того, что происходит в каждом из 3 приведенных выше примеров. Я заметил, что прямой вывод в (1) имеет класс «ng-scope», вставляемый angular в сгенерированную разметку. У двух других этого нет, но в родительский тег p вставлен класс привязки ng. Не уверен, что здесь происходит, но я думаю, что это как-то связано с моей проблемой.

У меня есть ощущение, что решение может включать директиву, но я не уверен, как бы я применил эту директиву к существующему тексту (то есть тегу p уже в разметке).

Спасибо!

РЕДАКТИРОВАТЬ: обновил jsfiddle для более точного отражения проблемы (четвертая строка в выводе)