angular2 bootstrap4ツールヒントはHTMLを表示しません。ポップオーバーは

Question

私はangular2とbootstrap4を使用しています。

public getM(): string { 
    return '<b>asdf</b>'; 
    } 

ツールチップとポップオーバー両方：ポップオーバーが正常に

<img src="assets/images/1.jpg" 
          data-container="body" data-toggle="popover" data-html="true" data-placement="top" 
          [attr.data-content]="getM()"/> 

空自として太字しかし、ツールチップは、タグ

<img src="assets/images/2.jpg" 
           data-container="body" data-toggle="tooltip" data-html="true" data-placement="top" 
           [attr.title]="getM()"/> 

コンポーネント方法GETM含むプレーン<b>asdf</b>テキストとしてレンダリング生のHTMLをレンダリング同じ方法で初期化されます

$(function() { 
    $('[data-toggle="tooltip"]').tooltip({container: 'body'}); 
    $('[data-toggle="popover"]').popover({container: 'body'}); 
}) 

なぜ誰かがそれを解決する方法を説明できますか？これは初期化の順序と関連しているようですが、どこをもっと見ていくか分かりません。

Answer 1

問題は、（ツールチップが添付された）要素が動的に作成されたことでした。

正確には、私は1秒遅れたサービスを受けました。新しいデータが到着したとき、コンポーネントの<img>要素が再作成されましたが、$('[data-toggle="tooltip"]')セレクタは動的要素では機能しません。

はその代わり、私が意図したとおり今、それが動作

$("body").tooltip({selector: '[data-toggle="tooltip"]'}); 

このセレクタを使用する必要がありました。

PS私はフロントエンドの開発者ではありませんので、より良い言葉で説明できる人は大歓迎です。