Javascript 角形中的双大括号不计算，作为文本贯穿

我有下面的代码

<div vh-accordion-group id="{{$index}}" panel-class="panel-info">
    <div vh-accordion-header> </div>
    <div vh-accordion-body>   </div>
</div>

这些手风琴使用ng repeat循环调用。
问题是我传入的

{{$index}}

被当作字符串而不是表达式。 我需要每个手风琴都有一个唯一的Id，以便它们能够正确地打开和关闭

---

请让我知道我缺少什么，因为我是angular的新手。

只需将

id

添加到隔离范围：

home.directive("vhAccordionGroup", ['version', function (version) {
return {
    restrict: 'EA',
    replace: true,
    transclude: true,
    scope: {
        panelClass: '@',
        id: '@'
    },
    templateUrl: "JS/HomeModule/Directives/vhAccordion/vhAccordionGroup.html?v=" + version,
    controller: ['$scope', '$element', function ($scope, $element) {
        $scope.accordionId = $scope.id + "vhAcc";

        this.getAccordionId = function () {
            return $scope.accordionId;
        };
    }],
    link: function (scope, element, attrs, vhAccordionGroupController) {
        element.addClass(scope.panelClass);
        scope.accordionId = scope.id + "vhAcc";
    }
};
}]);

---

然后，使用

$scope.id

（和

scope.id

）而不是

$element.attr

$element.attr

提供对实际DOM元素的访问，因此该值不会被插值是有意义的。

$index

是一个特殊变量，它显示在内部并且

ng repeat

。你在重复吗？是的，但该值不会计算，而是作为stringremove double Brages，然后它将对你有效。你看到的实际值是多少？值是文本字符串

$index

？我知道了，您看到的

{{$index}}

正确吗？

home.directive("vhAccordionGroup", ['version', function (version) {
return {
    restrict: 'EA',
    replace: true,
    transclude: true,
    scope: {
        panelClass: '@'
    },
    templateUrl: "JS/HomeModule/Directives/vhAccordion/vhAccordionGroup.html?v=" + version,
    controller: ['$scope', '$element', function ($scope, $element) {
        $scope.accordionId = $element.attr("id") + "vhAcc";

        this.getAccordionId = function () {
            return $scope.accordionId;
        };
    }],
    link: function (scope, element, attrs, vhAccordionGroupController) {
        element.addClass(scope.panelClass);
        scope.accordionId = element.attr("id") + "vhAcc";
    }
};
}]);

home.directive("vhAccordionGroup", ['version', function (version) {
return {
    restrict: 'EA',
    replace: true,
    transclude: true,
    scope: {
        panelClass: '@',
        id: '@'
    },
    templateUrl: "JS/HomeModule/Directives/vhAccordion/vhAccordionGroup.html?v=" + version,
    controller: ['$scope', '$element', function ($scope, $element) {
        $scope.accordionId = $scope.id + "vhAcc";

        this.getAccordionId = function () {
            return $scope.accordionId;
        };
    }],
    link: function (scope, element, attrs, vhAccordionGroupController) {
        element.addClass(scope.panelClass);
        scope.accordionId = scope.id + "vhAcc";
    }
};
}]);