fix(accordion): assign is-open to correct scope

Closes #1034

Author: bekos

src/accordion/accordion.js

@@ -5,10 +5,13 @@ angular.module('ui.bootstrap.accordion', ['ui.bootstrap.collapse'])
 })
 
 .controller('AccordionController', ['$scope', '$attrs', 'accordionConfig', function ($scope, $attrs, accordionConfig) {
-  
+
   // This array keeps track of the accordion groups
   this.groups = [];
 
+  // Keep reference to user's scope to properly assign `is-open`
+  this.scope = $scope;
+
   // Ensure that all the groups in this accordion are closed, unless close-others explicitly says not to
   this.closeOthers = function(openGroup) {
     var closeOthers = angular.isDefined($attrs.closeOthers) ? $scope.$eval($attrs.closeOthers) : accordionConfig.closeOthers;
@@ -78,20 +81,17 @@ angular.module('ui.bootstrap.accordion', ['ui.bootstrap.collapse'])
         getIsOpen = $parse(attrs.isOpen);
         setIsOpen = getIsOpen.assign;
 
-        scope.$watch(
-          function watchIsOpen() { return getIsOpen(scope.$parent); },
-          function updateOpen(value) { scope.isOpen = value; }
-        );
-        
-        scope.isOpen = getIsOpen ? getIsOpen(scope.$parent) : false;
+        accordionCtrl.scope.$watch(getIsOpen, function(value) {
+          scope.isOpen = !!value;
+        });
       }
 
       scope.$watch('isOpen', function(value) {
         if ( value ) {
           accordionCtrl.closeOthers(scope);
         }
         if ( setIsOpen ) {
-          setIsOpen(scope.$parent, value);
+          setIsOpen(accordionCtrl.scope, value);
         }
       });
     }

src/accordion/docs/demo.html

@@ -5,7 +5,7 @@
   </label>
 
   <accordion close-others="oneAtATime">
-    <accordion-group heading="Static Header">
+    <accordion-group heading="Static Header, initially expanded" is-open="true">
       This content is straight in the template.
     </accordion-group>
     <accordion-group heading="{{group.title}}" ng-repeat="group in groups">
@@ -16,9 +16,9 @@
         <button class="btn btn-small" ng-click="addItem()">Add Item</button>
         <div ng-repeat="item in items">{{item}}</div>
     </accordion-group>
-    <accordion-group>
+    <accordion-group is-open="isopen">
         <accordion-heading>
-            I can have markup, too! <i class="icon-check"></i>
+            I can have markup, too! <i class="pull-right" ng-class="{'icon-chevron-down': isopen, 'icon-chevron-right': !isopen}"></i>
         </accordion-heading>
         This is just some content to illustrate fancy headings.
     </accordion-group>

src/accordion/test/accordionSpec.js

@@ -232,7 +232,17 @@ describe('accordion', function () {
       it('should open the group with isOpen set to true', function () {
         expect(findGroupBody(0).scope().isOpen).toBe(false);
         expect(findGroupBody(1).scope().isOpen).toBe(true);
-       });
+      });
+
+      it('should toggle variable on element click', function() {
+        findGroupLink(0).click();
+        scope.$digest();
+        expect(scope.open1).toBe(true);
+
+        findGroupLink(0).click();
+        scope.$digest();
+        expect(scope.open1).toBe(false);
+      });
     });
 
     describe('is-open attribute with dynamic content', function() {