0

我正在使用 Bootstrap UI 的手风琴指令。这在引擎盖下使用了嵌入。我有一些需要重复的逻辑，所以我试图创建一个包装手风琴的指令，它也使用嵌入。

<div>
    <div accordion>
        <div accordion-group is-open="isOpen">
            <div accordion-heading>
                <span class="glyphicon" ng-class="{'glyphicon-minus-sign': isOpen, 'glyphicon-plus-sign': !isOpen}"></span>
                <strong>{{headerTitle}}</strong>
            </div>
            <div ng-transclude></div>
        </div>
    </div>
</div>

这是JavaScript：

application.directive('collapsePanel', ['baseUrl', function (baseUrl) {
    return {
        restrict: 'A',
        templateUrl: baseUrl + 'content/templates/collapse_panel.html',
        replace: true,
        transclude: true,
        scope: {
            headerTitle: '@'
        },
        controller: ['$scope', function ($scope) {
            $scope.isOpen = false;
        }]
    };
}]);

使用起来应该很简单：

<div collapse-panel header-title="Title">
    {{scopeVariable}}
</div>

假设scopeVariable在我的控制器中，我认为它的值会出现。据我所知，范围属于collapse-panel而不是外部范围。这几乎就像嵌套的嵌入指令导致了我的问题。

像这样嵌套嵌入有技巧吗？

4

0 回答 0