Angularjs popover中的Html表单

我正在尝试用angularjs创建一个带有html表单的自定义popover。这个想法是，当用户用popover按下按钮时，里面会显示5个单选按钮。选中单选按钮时，每个单选按钮下都会打印一条消息

以下是指令代码：

var customPopoverApp=angular.module('customPopOverApp',[]);

customPopoverApp.directive('customPopover',['$compile','$templateCache',function($compile,$templateCache){
   return {
       restrict:'A',
       transclude:true,
       template:"<span>Click on me to show the popover</span>",
       link:function(scope,element,attr){
            var contentHtml = $templateCache.get("customPopover.html");
            contentHtml=$compile(contentHtml)(scope);
            $(element).popover({
            trigger:'click',
            html:true,
            content:contentHtml,
            placement:attr.popoverPlace
       });
   }
};
}]);

以下是主要的html模板： 爆裂试验

下面是plunker的完整示例：

这件府绸很好用。。。第一次。如果我关闭popover并再次打开，就好像它从未被编译过一样

---

你们中有谁知道为什么第二次爆米花不起作用吗？

每次对我都起作用。有趣的是，对我来说它不起作用。请按照以下步骤重试：1按下按钮打开popover，2单击单选按钮，3再次按下按钮关闭popover，4按下按钮再次打开popover，5单击单选按钮。它仍在工作？顺便说一句，您应该在每个输入上添加一个name属性，以获得典型的单选按钮行为，其中选择是互斥的。感谢您的帮助@schmidlop，但是，我添加了name属性，单选按钮仍然像复选框一样工作：name属性的值必须相同，以指示单选按钮在同一组中。这可能会帮助您：

<div class="navbar navbar-default menu-nav" role="navigation">
    <ul class="nav navbar-nav navbar-left">
        <li>
          <button custom-popover="" popover-place="bottom">click on me to show the popover</button>
        </li>
    </ul>
    </div>
 </div>
 <script type="text/ng-template" id="customPopover.html">
     <h2>Organizacion de la tabla</h2>
     <div class="radio">
         <label>
             <input type='radio' ng-checked="option1" ng-click='showMessage("Option 1 checked")'/>&nbsp;Option 1<br/>
        </label>
    </div>
    <div class="radio">
        <label>
            <input type='radio' ng-checked="option2" ng-click='showMessage("Option 2 checked")'/>&nbsp;Option 2<br/>
        </label>
    </div>
    <div class="radio">
        <label>
            <input type='radio' ng-checked="option3" ng-click='showMessage("Option 3 checked")'/>&nbsp;Option 3<br/>
       </label>
    </div>
    <div class="radio">
        <label>
            <input type='radio' ng-checked="option4" ng-click='showMessage("Option 4 checked")'/>&nbsp;Option 4<br/>
        </label>
    </div>
    <div class="radio">
        <label>
            <input type='radio' ng-checked="option5" ng-click='showMessage("Option 5 checked")'/>&nbsp;Option 5<br/>
        </label>
    </div>
</script>
<div ui-view></div>