1

ボタングループの各ボタンに angular-bootstrap ツールチップを追加しようとしています。これを行うと、右ボタンをホバリングすると、すべてのボタンのスタイルが破棄されます。

html:

  <div class="btn-group" style="margin-top:100px;">
      <label class="btn btn-primary" tooltip="{{dynamicTooltip}}" ng-model="radioModel" btn-radio="'Left'">Left</label>
      <label class="btn btn-primary" tooltip="{{dynamicTooltip}}" ng-model="radioModel" btn-radio="'Middle'">Middle</label>
      <label class="btn btn-primary" tooltip="{{dynamicTooltip}}" ng-model="radioModel" btn-radio="'Right'">Right</label>
  </div>

js:

angular.module('ui.bootstrap.demo', ['ui.bootstrap']);
angular.module('ui.bootstrap.demo').controller('TooltipDemoCtrl', function ($scope) {
  $scope.dynamicTooltip = 'Hello, World!';
});

ここに私のプランカーがあります: http://plnkr.co/edit/NFjJJXEKyJHDgddcPdNa?p=preview

4

1 に答える 1

5

ツールチップが btn-group 内で生成されているためです。これは、ツールチップが消えるまでスタイリングが変更されるため、「右」ボタンがグループの最後の要素ではなくなったことを意味します。親ではなく本体にツールチップを追加してみてください。

<label class="btn btn-primary" tooltip="{{dynamicTooltip}}" tooltip-append-to-body="true" ng-model="radioModel" btn-radio="'Right'">Right</label>
于 2014-11-25T13:56:32.243 に答える