feat(buttons): support dynamic values in btn-radio

Author: pkozlowski-opensource

src/buttons/buttons.js

@@ -14,11 +14,9 @@ angular.module('ui.bootstrap.buttons', [])
     require:'ngModel',
     link:function (scope, element, attrs, ngModelCtrl) {
 
-      var value = scope.$eval(attrs.btnRadio);
-
       //model -> UI
       ngModelCtrl.$render = function () {
-        if (angular.equals(ngModelCtrl.$modelValue, value)){
+        if (angular.equals(ngModelCtrl.$modelValue, scope.$eval(attrs.btnRadio))){
           element.addClass(activeClass);
         } else {
           element.removeClass(activeClass);
@@ -29,7 +27,7 @@ angular.module('ui.bootstrap.buttons', [])
       element.bind(toggleEvent, function () {
         if (!element.hasClass(activeClass)) {
           scope.$apply(function () {
-            ngModelCtrl.$setViewValue(value);
+            ngModelCtrl.$setViewValue(scope.$eval(attrs.btnRadio));
             ngModelCtrl.$render();
           });
         }

src/buttons/test/buttons.spec.js

@@ -100,5 +100,24 @@ describe('buttons', function () {
       expect(btns.eq(1)).toHaveClass('active');
       expect(btns.eq(0)).not.toHaveClass('active');
     });
+
+    it('should watch btn-radio values and update state accordingly', function () {
+      $scope.values = ["value1", "value2"];
+
+      var btns = compileButtons('<button ng-model="model" btn-radio="values[0]">click1</button><button ng-model="model" btn-radio="values[1]">click2</button>', $scope);
+      expect(btns.eq(0)).not.toHaveClass('active');
+      expect(btns.eq(1)).not.toHaveClass('active');
+
+      $scope.model = "value2";
+      $scope.$digest();
+      expect(btns.eq(0)).not.toHaveClass('active');
+      expect(btns.eq(1)).toHaveClass('active');
+
+      $scope.values[1] = "value3";
+      $scope.model = "value3";
+      $scope.$digest();
+      expect(btns.eq(0)).not.toHaveClass('active');
+      expect(btns.eq(1)).toHaveClass('active');
+    });
   });
 });