diff --git a/src/stateDirectives.js b/src/stateDirectives.js index 0a66185f0..e62bafe92 100644 --- a/src/stateDirectives.js +++ b/src/stateDirectives.js @@ -289,14 +289,20 @@ function $StateRefActiveDirective($state, $stateParams, $interpolate) { return { restrict: "A", controller: ['$scope', '$element', '$attrs', '$timeout', function ($scope, $element, $attrs, $timeout) { - var states = [], activeClasses = {}, activeEqClass; + var states = [], activeClasses = {}, activeEqClass, uiSrefActive; // There probably isn't much point in $observing this // uiSrefActive and uiSrefActiveEq share the same directive object with some // slight difference in logic routing activeEqClass = $interpolate($attrs.uiSrefActiveEq || '', false)($scope); - var uiSrefActive = $scope.$eval($attrs.uiSrefActive) || $interpolate($attrs.uiSrefActive || '', false)($scope); + try { + uiSrefActive = $scope.$eval($attrs.uiSrefActive); + } catch (e) { + // Do nothing. uiSrefActive is not a valid expression. + // Fall back to using $interpolate below + } + uiSrefActive = uiSrefActive || $interpolate($attrs.uiSrefActive || '', false)($scope); if (isObject(uiSrefActive)) { forEach(uiSrefActive, function(stateOrName, activeClass) { if (isString(stateOrName)) { diff --git a/test/stateDirectivesSpec.js b/test/stateDirectivesSpec.js index 7af62ba99..a9c0f120f 100644 --- a/test/stateDirectivesSpec.js +++ b/test/stateDirectivesSpec.js @@ -635,6 +635,17 @@ describe('uiSrefActive', function() { expect(angular.element(template[0].querySelector('a')).attr('class')).toBe('active'); })); + it('should allow multiple classes to be supplied', inject(function($rootScope, $q, $compile, $state) { + template = $compile('
')($rootScope); + $rootScope.$digest(); + var a = angular.element(template[0].getElementsByTagName('a')[0]); + + $state.transitionTo('contacts.item.edit', { id: 1 }); + $q.flush(); + timeoutFlush(); + expect(a.attr('class')).toMatch(/active also-active/); + })); + describe('ng-{class,style} interface', function() { it('should match on abstract states that are included by the current state', inject(function($rootScope, $compile, $state, $q) { el = $compile('')($rootScope);