角度ui popover闪烁不正确的位置

时间:2016-06-27 22:47:01

标签: angularjs angular-bootstrap

通过更新angular-bootstrap或将模板添加到$ templateCache,我看到有关此错误的帖子已修复,但这些修复程序都没有对我有用。问题是当弹出窗口时,初始位置是不正确的,即它位于0,0而不是指令所应用的元素。因此,弹出窗口从0,0跳到正确的位置。显示的弹出窗口是在另一个指令中,因此我不确定这是否是一个问题。

//指令

(function(){
'use strict';

angular.module('myApp')
.directive('campaignItem', function () {
  return {
    restrict: 'A',
    scope: {
      campaigns: '=',
      userRole: '@'
    },
    templateUrl: 'campaign.tpl.html',
    link: function(scope, element, attr) {
    }
  };
})
.directive('campaignChangesPopover', function() {
  return {
    restrict: 'EA',
    replace: true,
    scope: {
      ngModel: '='
    },
    template: '<a uib-popover-template="\'campaign-popover.html\'" popover-placement="right">Popover</a>',
    link: function(scope, element, attr) {     
    }
  };
});

});

// campaignItem模板

...
<td colspan="3">
  <strong>Recent Changes</strong>
  <p><a campaign-changes-popover>view changes</a></p>
</td>
...

// campaignChangesPopover模板

<strong>Change Log</strong><br />
<span>Josh Fox Approved Policy 11/24/2015</span><br />
<span>Brian Adamski Changed Policy. 11/23/2015</span><br />
<span>Josh Fox Requested Change: Modify Policy. Date 11/20/2015</span><br />
<span>Brian Adamski Submitted Campaign for Approval 11/16/2015</span><br />
<span>Brian Adamskit Created Campaign 11/15/2015</span>

//尝试使用$ timeout

template: '<a uib-popover-template="\'campaign-popover.html\'" popover-placement="right" popover-trigger="none" ng-click="showPopover()" popover-is-open="isOpen">Popover</a>',
    link: function(scope, element, attr) {
      scope.isOpen = false;
      scope.showPopover = function() {
        $timeout(function() {
          scope.isOpen = !scope.isOpen;
        }, 400);
      };
    }

2 个答案:

答案 0 :(得分:0)

通常人们会以丑陋的方式解决这类问题:$ timeout(showPopover(),400)确保元素在弹出窗口之前呈现,以便通过坐标计算的位置是正确的。

答案 1 :(得分:0)

必须关闭popover动画,例如popover-animation =“false”