Como criar um popover de bootstrap da interface do usuário AngularJS com conteúdo HTML?

Eu quero criar um popover bootstrap com uma tag pré contendo um object JSON prettified. A implementação ingênua,

<span popover='
{[ some_obj | json:" " ]}

' popover-trigger='mouseenter'>

escapa o conteúdo antes de inseri-lo no pop-up. Qual é a melhor maneira de especificar um corpo popover com conteúdo html?

ATUALIZAÇÃO :

Como já foi visto, você deve conseguir fazer isso sem replace o modelo padrão.

ORIGINAL:

A partir do ângulo 1.2 + ng-bind-html-unsafe foi removido. você deve estar usando o serviço $ sce . Referência .

Aqui está um filtro para criar um html confiável.

 MyApp.filter('unsafe', ['$sce', function ($sce) { return function (val) { return $sce.trustAsHtml(val); }; }]); 

Aqui está o modelo sobrescrito do Angular Bootstrap 0.11.2 fazendo uso deste filtro

 // update popover template for binding unsafe html angular.module("template/popover/popover.html", []).run(["$templateCache", function ($templateCache) { $templateCache.put("template/popover/popover.html", "
\n" + "
\n" + "\n" + "
\n" + "

\n" + "
\n" + "
\n" + "
\n" + ""); }]);

EDIT: aqui é uma implementação Plunker .

EDIT 2: Como esta resposta continua recebendo hits, vou mantê-lo atualizado da melhor maneira possível. Como referência Aqui está o modelo do repository de bootstrap angular-ui. Se isso mudar, o modelo de substituição exigirá atualizações correspondentes e a adição dos atributos ng-bind-html=\"title | unsafe\" e ng-bind-html=\"content | unsafe\" continuará funcionando.

Para conversa atualizada, verifique o problema aqui .

Use a diretiva popover-template

Se você estiver usando uma versão do angular-ui igual ou acima de 0.13.0 , sua melhor opção é usar a diretiva popover-template . Aqui está como usá-lo:

   

NB: Não esqueça as aspas em torno do nome do template em popover-template="'popover.html'" .

Ver demo plunker


Como uma nota lateral, é possível externalizar o modelo popover em um arquivo html dedicado, em vez de declará-lo em um elemento

Web Analytics