Question

我有一个利用bootstrap UI的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: '='
        }
    }
});

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

1 个答案: