Bootstrap：Safariで機能しないドロップダウンアイテムを切り替えます

Question

私はブートストラップ3.3.7とjquery 1.12.4を使用する角度2のアプリケーションを持っています。コードは以下の通りである：

<div class="btn-group"> 
 

 
       <button type="button" class="btn dropdown-toggle" 
 
         title="More actions" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" 
 
         > 
 
        <span class="sr-only">More actions</span> 
 
        <i class="fa fa-ellipsis-v fa-lg" ></i> 
 
       </button> 
 

 
       <ul class="dropdown-menu dropdown-menu-right menu" role="menu"> 
 
        <li> 
 
         <button *ngIf="itemViewModel.IsCopy !== true" type="button" class="btn dropdown-button" (click)="Copy($event)" title="Copy" 
 
           > 
 
          <i class="fa fa-files-o" (click)="Copy($event)"></i> 
 
          Copy 
 
         </button> 
 
        </li> 
 
        <li> 
 
         <button type="button" class="btn dropdown-button" (click)="Move($event)" title="Move"> 
 
          <i class="fa fa-arrows" (click)="Move($event)"></i> 
 
          Move 
 
         </button> 
 
        </li> 
 
        <li> 
 
         <button *ngIf="itemViewModel.IsShare !== true" type="button" class="btn dropdown-button" (click)="Share($event)" title="Share"> 
 
          <i class="fa fa-share " (click)="Share($event)"></i> 
 
          Share 
 
         </button> 
 
        </li> 
 
        <li> 
 
         <button type="button" class="btn dropdown-button" (click)="removeItem($event)" title="Delete"> 
 
          <i class="fa fa-trash" (click)="removeItem($event)"></i> 
 
          Delete 
 
         </button> 
 
        </li> 
 
       </ul> 
 
      </div>

ドロップダウンメニューが表示されます罰金。しかし、リスト内の個々のボタンをクリックしても、関連付けられたイベントハンドラは呼び出されません。この問題は、iOSのSafariブラウザとAndroidのChromeで発生しています。しかし、それは完全にラップトップ/デスクトップ上のエッジとクロムで動作します。

以前のバージョンのBootstrapでstackoverflowとgithubで提供されたさまざまなソリューションを試しましたが、動作しません。

これを動作させるにはどうすればよいですか？

Answer 1

私はNG2-ブートストラップからのドロップダウンを使用してこの問題を解決 - >https://github.com/valor-software/ng2-bootstrap