below is the code used to load pop up on hover it doesn't load on first hover .it work fine on second hover
<i id="weaCarrierIcon" class="fas fa-info-circle fa-lg infoIcon weaCarrier-infoicon" ng-click="weaCarrierPopover()" ng-mouseover="weaCarrierPopover()" data-toggle="popover" data-content="{{model.weaCarrierPopover}}"></i>
$scope.weaCarrierPopover = function () {
$('#weaCarrierIcon').popover({ placement: 'bottom', trigger: 'hover', html: true, delay: { show: 50, hide: 400 } });
};