javascript - Double braces in angular not evaluating , going through as text -
i have following code in angular.
<div vh-accordion-group id="{{$index}}" panel-class="panel-info"> <div vh-accordion-header> </div> <div vh-accordion-body> </div> </div> the html accordion-group :
<div class="panel panel-info" ng-transclude> </div> also, js same :
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"; } }; }]); these accordions called in loop using ng-repeat.
problem {{$index}} passing in id being taken string rather expression. need each of accordions have unique id can open , close correctly.
please let me know missing, newbie angular.
simply add id isolated scope:
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"; } }; }]); then, use $scope.id (and scope.id) instead of $element.attr. $element.attr gives access actual dom element , makes sense value not interpolated.
Comments
Post a Comment