Comment utiliser Popover Bootstrap avec Angular2

Je suis en train d'essayer d'obtenir un Bootstrap 3 liste pour afficher Angulaire à 2 interpolées modèle. Est-ce possible? Voici ce que j'ai à ce jour:

    $('.ba-header--user-menu').popover({
      placement: 'bottom',
      toggle: 'popover',
      trigger: 'focus',
      html: true,
      content: '{{user.email}}'
    });

Qui me donne ceci:

Comment utiliser Popover Bootstrap avec Angular2

source d'informationauteur Dylan Harness

  1. 11

    JQuery et Angulaire ne jouent pas très bien ensemble. Installer ng2-liste:

    npm i ng2-popover

    et de l'utiliser comme ceci:

    <span popover="content to be shown in the popover">
    element on which this popover is applied.
</span>
  2. 2

    Vous pouvez également essayer une bibliothèque, j'ai publié ng2-pop-over (à ne pas confondre avec ng2-liste mentionnée ci-dessus). Il est compact et vous aurez à ajouter vos styles, mais a ce qu'il faut pour résoudre votre problème sans jQuery.

  3. 1

    oui c'est possible, mais vous ne pouvez pas appeler interpoleted symbole dans le plugin jQuery la façon dont vous êtes en train de faire.
    vous devez assigner votre dynamique e-mail directement à l'aide de this comme ça.

    ngOnInit(){
   $('#abc').popover({
      placement: 'bottom',
      toggle: 'popover',
      title: 'khcksahkdfs'
      html: true,
      content: this.name
    });
 }

 <a id="abc">Toggle popover</a>

    de travail Démo ici