Написание пользовательской директивы для добавления всплывающих подсказок к ng-опциям в AngularJS (TypeScript)

У меня есть некоторый HTML-код, который в настоящее время заполняет поле выбора с помощью директивы ng-options. Наша проблема в том, что ng-options не поддерживает использование всплывающих подсказок. Чтобы решить эту проблему, я пытаюсь написать пользовательскую директиву, но я новичок в AngularJS и TypeScript, поэтому я не уверен, куда идти оттуда, где я нахожусь.

Вот соответствующий код:

HTML

<select grid-column-tooltip class = "select-box" id = "availableColumn" size = "5" 
        ng-options = "column as column.localizedTitle for column in vm.availableColumns | filter: vm.environmentMatches track by column.field" 
        ng-model = "vm.availableColumnElement"
        ng-dblclick = "vm.moveToSelectedColumns()">
    <option value = "" ng-if = "false"></option>
</select>

В объекте column есть поле с именем environmentLabel, которое я хочу отображать в виде всплывающей подсказки при наведении курсора.

Javascript

module psfc {
class GirdColumnTooltipDirective implements ng.IDirective {
    restrict = 'A';

    template = '<div class = "grid-column-tooltip">{{column.environmentLabel}}</div>';
    constructor(
    ) { }       

    static directive = (): ng.IDirectiveFactory => {
        return () => new GirdColumnTooltipDirective();
    }
}

angular
    .module('psfc')
    .directive('gridColumnTooltip', GirdColumnTooltipDirective.directive());
}

Это, очевидно, очень неполное, потому что я не уверен, как реализовать то, что я хочу, в машинописном тексте. Я также не уверен, стоит ли превращать шаблон в div, который появляется при наведении курсора, или найти способ добавить атрибут title к соответствующему элементу option.

Кроме того, в зависимости от решения, я пока не беспокоюсь о CSS. Я могу исправить любые проблемы со стилем позже.