Eu tenho um formulário que está conectado em angular, usando-o para validação. Sou capaz de exibir mensagens de erro usando as diretivas ng-show da seguinte maneira:

<span ng-show="t3.f.needsAttention(f.fieldName)" ng-cloak>
    <span ng-show="f.fieldName.$error.required && !f.fieldName.$viewValue">
        This field is required.
    </span>
</span>

.. Ondef é a forma et3 vem de uma diretiva personalizada no formulário que detecta se um envio foi tentado e contém funções para verificar a validade dos campos.

O que estou tentando realizar é exibir mensagens de validação dentro de uma popover. O popover nativo do bootstrap ou o popover deInicialização da interface do usuário, Eu tenho ambos carregados. Também posso considerar o AngularStrap se for mais fácil fazê-lo usando essa lib.

No momento, estou enfrentando dificuldades com a natureza dos popovers - eles são exibidos automaticamente com base em eventos do usuário, como clique, mouseenter, blur etc. O que eu quero fazer é mostrar e ocultar os popovers com base no mesmo funções nos atributos ng-show acima. Para que, quando a expressão retornar falsa, oculte-a e quando ela retorne verdadeira, mostre-a.

Eu sei que o bootstrap tem o .popover ('show') para isso, mas não devo contar nada angular sobre o dom, então não tenho certeza de como obteria o acesso a $ (element) .popover () se fazendo isso em uma função de controlador de formulário personalizado. Estou esquecendo de algo?

Atualizar

A solução mencionada na votação duplicada ainda mostra apenas a popover no mouseenter. Eu quero forçá-lo a exibir, como se estivesse fazendo$('#popover_id').popover('show').