如何在Angular UI Bootstrap中設置模板變量？ （手風琴）

Question

我嘗試用Angular UI Bootstrap製作手風琴（http://angular-ui.github.io/bootstrap/#/accordion）。在How do I set model according to chosen accordion group. UI Bootstrap我找到了一個使用模板的工作解決方案。

在我的代碼我<script type="text/ng-template" id="template/accordion/accordion-group.html">

添加模板在這個模板可以使用{{heading}}通過<accordion-group heading="{{group.title}}" content="{{group.content}}" ng-repeat="group in groups"></accordion-group>設置。

但我如何設置其他自定義模板變量？ 我也嘗試在手風琴標籤中設置content="{{group.content}}"。即使設置，我也不知道如何使用它，試過{{content.group}} {{content}}和{% content %}。

完整代碼上：http://plnkr.co/dSIVGg64vYSTAv5vFSof

Answer 1

見編輯plunker：http://plnkr.co/edit/8YCUemqILQy3knXqwomJ

你試圖巢一條指令的模板內的控制器。我可能會誤解，但那不起作用，或者至少不是非常好的方式。

取代嵌套控制器，我建議將CollapseDemoCtrl也轉換爲指令。然後，您可以將{{group.content}}或任何其他內容傳遞給此指令。

---

編輯：如何傳遞數據實例來指令範圍

的HTML將是這樣的：

<span ng-repeat="group in groups"> 
    <div testDirective content="group.content" title="group.title"> </div> 
</span> 

該指令將是這個樣子：

angular.module('testModule', []) 
    .directive('testDirective', function(){ 
    return { 
     restrict: 'A', 
     scope: { 
     content:'=content', 
     title: '=title' 
     }, 
     template: '<h1>{{title}}<h1> <div>{{content}}</div>', 
     link: function(scope, element, attrs) { 
     } 
    } 
    });