AngularJS Bootstrap-UIのツールチップ - コントローラでオプションを設定する方法

Question

私は、ブートストラップ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: '=' 
     } 
    } 
});