2016-06-27 6 views
0

Ich habe Posts über diesen Bug gesehen, entweder durch Update von angular-bootstrap oder durch Hinzufügen der Vorlage zu $ ​​templateCache, aber keine dieser Fixes hat für mich funktioniert. Das Problem ist, dass wenn das Popover gerendert wird, die Anfangsposition falsch ist, d. H. Es ist auf 0,0 positioniert, anstatt auf das Element, auf das die Direktive angewendet wird. Also springt das Popover von 0,0 auf die korrekte Position. Das angezeigte Popover befindet sich in einer anderen Direktive, daher bin ich mir nicht sicher, ob das vielleicht ein Problem ist.angular ui popover flicker falsche Position

// Richtlinien

(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 Vorlage

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

// campaignChangesPopover Vorlage

<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> 

// versucht mit $ 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); 
     }; 
    } 

Antwort

0

Normalerweise lösen die Leute diese Art von Problemen auf unschöne Weise: $ timeout (showPopover(), 400) um sicherzustellen, dass das Element vor dem Popup gerendert wird, damit die durch seine Koordinaten berechneten Positionen korrekt sind.

+0

zu deaktivieren, aber das funktioniert auch nicht. Siehe oben meine Bearbeitung mit $ timeout. – neridaj

0

Hatte popover Animation z. B. Popover-Animation = "false"