Angular UI Bootstrap：動態彈出窗口模板ID

Question

是否可以使用帶有動態ID的模板進行Angular UI Popover？

例如：

<div ng-repeat="row in data"> 
    <button class="btn" uib-popover-template="'myTemplate_{{row.id}}.html'" popover-trigger="mouseenter">View</button> 
    <script type="text/ng-template" id="myTemplate_{{row.id}}.html"> 
     <strong>Name</strong>: {{row.name}}<br/> 
     <strong>Phone</strong>: {{row.phone}}<br/> 
     <strong>Email</strong>: {{row.email}} 
    </script> 
</div> 

當我鼠標懸停按鈕角試圖從服務器獲取的，而不是使用納克模板模板（例如myTemplate_1.html）。

我接近這個權利嗎？如果沒有，將動態html內容分配給popovers的最佳方式是什麼？

謝謝。

Answer 1

標識需要唯一，任何通過uib-popover-template傳遞的數據都將被解析。 id=myTemplate_{{row.id}}中的數據未被解釋。

嘗試這樣：

angular.module('test', []) 
 
    .controller('GreetingController', ['$scope', 
 
    function($scope) { 
 
     $scope.data = [{ 
 
     name: 'John' 
 
     }, { 
 
     name: 'Bill' 
 
     }]; 
 
    } 
 
    ]);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="test" ng-controller="GreetingController"> 
 
    <div ng-repeat="row in data"> 
 
    <button class="btn" uib-popover-template="myTemplate_row.html" popover-trigger="mouseenter">View</button> 
 
    </div> 
 
</div> 
 

 
<script type="text/ng-template" id="myTemplate_row.html"> 
 
    <strong>Name</strong>: {{row.name}} 
 
    <br/> 
 
    <strong>Phone</strong>: {{row.phone}} 
 
    <br/> 
 
    <strong>Email</strong>: {{row.email}} 
 
</script>

注例如不工作，我沒有UIB模塊，但基本是相同的，應該顯示。