2017-09-06 14 views
-3

pop-up内にボタンを作成しましたが、ng-click機能がトリガーされていません。ここでng-clickがポップオーバーで動作しない

は私のボタンです:

<div class="navbar-right"> 
    <ul class="nav navbar-nav"> 
     <li> 
     <button 
      href="#" 
      data-toggle="popover" 
      data-placement="bottom" 
      data-content="<button ng-click='logout()' class='pop'><p>Sign out</p></button>" 
      data-html="true"> 
      <i class="fa fa-cog fa-2x" aria-hidden="true"></i> 
     </button> 
     </li> 
    </ul> 
    </div> 

そして、ここでは私のjsです:

$(document).ready(function(){ 
    $('[data-toggle="popover"]').popover(); 
    }); 

私が行方不明です何?ありがとう!

+0

完全なHTMLコードを投稿してください。あなたの 'ng-controller 'はどこですか? –

+1

このアプローチは完全に間違っています。 '.popover()'はjQueryに基づくブートストラップ関数ですが、テンプレート 'data-content'はAngularJSによってコンパイルされることはありません。 https://angular-ui.github.io/bootstrap/でブートストラップ+ AngularJSをうまく使いましょう。 – lin

+0

角度テンプレートを第三者コンポーネント(つまり、生のブートストラップポップオーバー)に渡そうとしています。これを行うことはできません。具体的にはタイミングに合わせて、角度テンプレートはブートストラップコンポーネントが生成されるまでにコンパイルされません。代わりに、[UI Bootstrap Popover](https://angular-ui.github.io/bootstrap/#!#popover)を使用することを検討してください。望ましい結果を得ることができるはずです。 –

答えて

0

このようなものを試してみてください。

$(".pop-over-class").popover({ 
     'placement': 'bottom', 
     'trigger': 'click', 
     'html': true, 
     'container': 'body', 
     'content': function() { 
      return $compile($(".pop-over-class").html())(scope); 
     } 
} 

ポップオーバーに返されるコンテンツをコンパイルする必要があるため。

関連する問題