diff --git a/src/uiSelectMatchDirective.js b/src/uiSelectMatchDirective.js index 2f723eaad..81645389e 100644 --- a/src/uiSelectMatchDirective.js +++ b/src/uiSelectMatchDirective.js @@ -8,10 +8,12 @@ uis.directive('uiSelectMatch', ['uiSelectConfig', function(uiSelectConfig) { // Needed so the uiSelect can detect the transcluded content tElement.addClass('ui-select-match'); + var parent = tElement.parent(); // Gets theme attribute from parent (ui-select) - var theme = tElement.parent().attr('theme') || uiSelectConfig.theme; - var multi = tElement.parent().attr('multiple'); - return theme + (multi ? '/match-multiple.tpl.html' : '/match.tpl.html'); + var theme = getAttribute(parent, 'theme') || uiSelectConfig.theme; + var multi = angular.isDefined(getAttribute(parent, 'multiple')); + + return theme + (multi ? '/match-multiple.tpl.html' : '/match.tpl.html'); }, link: function(scope, element, attrs, $select) { $select.lockChoiceExpression = attrs.uiLockChoice; @@ -32,4 +34,15 @@ uis.directive('uiSelectMatch', ['uiSelectConfig', function(uiSelectConfig) { } }; + + function getAttribute(elem, attribute) { + if (elem[0].hasAttribute(attribute)) + return elem.attr(attribute); + + if (elem[0].hasAttribute('data-' + attribute)) + return elem.attr('data-' + attribute); + + if (elem[0].hasAttribute('x-' + attribute)) + return elem.attr('x-' + attribute); + } }]); diff --git a/test/select.spec.js b/test/select.spec.js index 5bc460549..e93467755 100644 --- a/test/select.spec.js +++ b/test/select.spec.js @@ -1603,6 +1603,44 @@ describe('ui-select tests', function() { expect(el.find('.ui-select-match-item').length).toBe(0); }); + it('should render intial state with data-multiple attribute', function () { + // ensure match template has been loaded by having more than one selection + scope.selection.selectedMultiple = [scope.people[0], scope.people[1]]; + + var el = compileTemplate( + ' \ + {{$item.name}} <{{$item.email}}> \ + \ +
\ +
\ +
\ +
' + ); + + expect(el).toHaveClass('ui-select-multiple'); + expect(el.scope().$select.selected.length).toBe(2); + expect(el.find('.ui-select-match-item').length).toBe(2); + }); + + it('should render intial state with x-multiple attribute', function () { + // ensure match template has been loaded by having more than one selection + scope.selection.selectedMultiple = [scope.people[0], scope.people[1]]; + + var el = compileTemplate( + ' \ + {{$item.name}} <{{$item.email}}> \ + \ +
\ +
\ +
\ +
' + ); + + expect(el).toHaveClass('ui-select-multiple'); + expect(el.scope().$select.selected.length).toBe(2); + expect(el.find('.ui-select-match-item').length).toBe(2); + }); + it('should set model as an empty array if ngModel isnt defined after an item is selected', function () { // scope.selection.selectedMultiple = [];