AngularJS Bootstrap-UI Tooltip - Как настроить параметры в контроллере

Question

У меня есть приложение angularJS, которое использует пользовательский интерфейс начальной загрузки. Я пытаюсь настроить некоторые всплывающие подсказки, которые имеют большое количество настраиваемых элементов. Вместо того, чтобы сделать мою разметку значительно больше, чем я предпочел бы, я хотел бы нажать опции в свой контроллер.

Текущая разметка выглядит следующим образом:

<p tooltip-placement="right" tooltip="{{bic.multipleIncomeTooltip()}}" tooltip-animation="true" tooltip-trigger tooltip-enable="bic.model.borrowers[bic.borrowerIndex()].income.hasMultipleEmployments"></p> 

Я бы предпочел, чтобы раздвинуть возможности для этого в мой контроллер, так что разметка может быть упрощена что-то вроде этого:

<p tooltip-options="bic.incomeTooltipOptions" /> 

Есть ли способ сделать это?

Answer 1

Да, создать свою собственную директиву, которая использует эту разметку, а затем передать все необходимые значения

HTML

<p tooltip-options="tooltipObject"></p> 

Js

angular.module('app', []) 
.directive('tooltipOptions', function() { 
    return { 
     restrict: 'A', 
     replace: true, 
     controller: ['$scope', function($scope) { 
     }], 
     template: '<p tooltip-placement="tooltipOptions.placement" tooltip-animation="tooltipOptions.animation"></p>', 
     scope: { 
      tooltipOptions: '=' 
     } 
    } 
});