bootstrap dropdown не работает в angularjs

Question

прочный текст Я хотел показать выпадающий щелчок по значку img, но выпадающий список не открывается при нажатии. Вот мой код ... любые ссылки будут оценены высоко.

<div class="dropdown"> 
<a href="javascript:void(0);" class="dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true"> 
    <span class="user-image" style="background-image: url('../images/rafi.jpg');"></span> 
</a> 
<ul class="dropdown-menu" aria-labelledby="dropdownMenu1"> 
    <li> 
     <div class="profile-pic"> 
      <img src="images/rafi.jpg" alt="Rafi Ali Khan"> 
     </div> 
    </li> 
    <li> 
     <h3>{{$scope.userLocalData[0].uname}}</h3></li> 
    <li><a href="" class="text-right">Profile</a></li> 
    <li><a href="" class="text-right">Log Out</a></li> 

</ul> 

Answer 1

Ваш код содержит некоторую недопустимый HTML-разметку. Например, я полагаю, вы имеете в виду role="button" вместо type="button" для элемента якоря. Кроме того, вы должны использовать href="#" или data-target="#" вместо href="javascript:void(0);". Вы можете попробовать следующее:

<div class="dropdown"> 
    <a href="#" class="dropdown-toggle" role="button" id="dropdownMenu1" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"> 
    <span class="user-image" style="background-image: url('../images/rafi.jpg');"></span> 
    </a> 
    <ul class="dropdown-menu" aria-labelledby="dropdownMenu1"> 
    <li> 
     <div class="profile-pic"> 
     <img src="images/rafi.jpg" alt="Rafi Ali Khan"> 
     </div> 
    </li> 
    <li><h3>{{$scope.userLocalData[0].uname}}</h3></li> 
    <li><a href="" class="text-right">Profile</a></li> 
    <li><a href="" class="text-right">Log Out</a></li> 
    </ul> 
</div>