AngularJS Bootstrap-UI 工具提示 - 如何在控制器中配置选项

Question

我有一个 angularJS 应用程序正在利用 bootstrap UI。我正在尝试设置一些 bootstrap 工具提示，其中包含大量可配置元素。我不想让我的标记比我想要的大得多，而是想将选项推送到我的控制器中。

当前标记看起来像这样：

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

AngularJS Bootstrap-UI 工具提示 - 如何在控制器中配置选项

AngularJS Bootstrap-UI Tooltip - How to Configure Options in Controller

angularjs

angular-ui-bootstrap