Angular-UI下拉列表沒有打開

Question

我正在從javascript對象生成html 。 例如我有以下對象：

var e = [{'element' : 'button', 'innerHTML' : '<span class="dropdown-toggle">More<span class="caret"></span></span><ul class="dropdown-menu"><li>Menu item</li></ul>',
          'attrs' : {'class' : 'btn dropdown'}}];

和js函數生成以下字符串$scope.my_template ：

<button class="btn dropdown">
    <span class="dropdown-toggle">More
        <span class="caret"></span>
    </span>

   <ul class="dropdown-menu">
      <li>Menu item</li>
  </ul>
</button>

比我試圖通過以下方式將此模板應用於html頁面：

<div ng-bind-html-unsafe="my_template">
</div>

我在頁面上看到下拉按鈕，但是單擊它時，它沒有打開。

Answer 1

我認為my_template的內容是錯誤的。

我對其進行了更改，並對其正常工作： http : //plnkr.co/edit/9VPMl35wzrUFkEWHFup5?p=preview

現在$scope.my_template的內容是：

<div class="dropdown">
     <button data-toggle="dropdown" class="btn dropdown-toggle" >More <span class="caret"></span></button>

     <ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
         <li>Menu item</li>
     </ul>
</div>