AngularJS Bootstrap-UI Tooltip - 如何在控制器中配置选项

Question

我有一个angularJS应用程序，它利用引导UI。我试图设置一些引导工具提示，它有大量的可配置元素。我不想让自己的标记比我想要的大得多，我想将选项推到我的控制器中。

当前的标记看起来是这样的：

<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: '=' 
     } 
    } 
});