angular-ui/angular-ui.github.com

how do i use the tooltip with different placement?

fabiankessler opened this issue · 2 comments

the example shows:

<a data-original-title="{{tooltip}}" ui-jq="tooltip">Fill the input for a dynamic Tooltip:</a>

<script>
myModule.value('ui.config', {
   // The ui-jq directive namespace
   jq: {
      // The Tooltip namespace
      tooltip: {
         // Tooltip options. This object will be used as the defaults
         placement: 'right'
      }
   }
});
</script>

i'd like to render it to the 'right' in some places, and to the 'bottom' in others. is this not possible just with html tag attributes?
may be a stupid question... couldn't find anything online, and what i tried didn't work.

since i'm using bootstrap too, this works for me:
another attribute on the tag, eg data-placement="bottom".
found it here: http://twitter.github.com/bootstrap/javascript.html#tooltips

You can also pass options that will override the global options:

<a data-original-title="{{tooltip}}" ui-jq="tooltip" ui-options=" { placement: 'bottom' } ">Fill the input for a dynamic Tooltip:</a>

However I think your approach will be a little less verbose. Keep in mind you can store complex configuration objects in variables and then just do ui-options="tooltipBottom" which is what I do for other plugins.