Some times i have error [ui.select:transcluded] Expected 1 .ui-select-choices but got '0'.

[a-reznic]

Error: [ui.select:transcluded] Expected 1 .ui-select-choices but got '0'.
at http://localhost:63342/test/src/js/select.js:77:14
at http://localhost:63342/test/src/js/select.js:804:19
at publicLinkFn (http://localhost:63342/test/src/js/libs/angular.js:5933:29)
at boundTranscludeFn (http://localhost:63342/test/src/js/libs/angular.js:6059:21)
at controllersBoundTransclude (http://localhost:63342/test/src/js/libs/angular.js:6669:18)
at link (http://localhost:63342/test/src/js/select.js:786:9)
at nodeLinkFn (http://localhost:63342/test/src/js/libs/angular.js:6648:13)
at http://localhost:63342/test/src/js/libs/angular.js:6850:13
at http://localhost:63342/test/src/js/libs/angular.js:8050:11
at wrappedCallback (http://localhost:63342/test/src/js/libs/angular.js:11498:81)

if refresh page error disapear and sometime error appear...

[a-reznic]

help pls

[DineshkumarT]

+1 - It's occurring for the select2 theme

[dimirc]

Can you create a plunker so that I can reproduce this error?

[dimirc]

Looks related to #224

[jayhogan]

What version of Angular are you using? I had this problem with 1.2.14 but works fine after upgrading (in my case to 1.2.26).

[a-reznic]

i use AngularJS v1.2.20
OK i try to update

[a-reznic]

problem remain

[DineshkumarT]

@zloyreznic I also had the same issue,but now everything fixed.Make sure the following two things
1)Angular version >= 1.2.25
2)Use the select.js bundled under the 'dist' folder instead of the one present under 'src' folder.

Thanks
-Dinesh

[WaterSlide]

+1 For using select.js under dist. Fixed the issue immediately. Thanks!

[purestgreen]

I'm getting this error, and am using ui-select version 0.9.5 (from the dist folder), and angular 1.3.6

I have found that the error appears when I include this CSS styling:

.select2-container .select2-choice {
height: 31px;
}

And it goes away again when I remove this styling.....

[nasturah]

I was struggling to resolve this issue for 2 days. I tried different versions of Angular (1.2.9, 1.3.13, and 1.4.0b), choice of theme, timeouts etc. - nothing worked.

I finally resolved the issue by copying the theme templates to be in-line angular script tags instead of loading them via an HTTP request. There was a strange race condition between compilation of the templates and transclusion of the drop-down items - this was the only thing that was able to fix the problem.

This also fixes issue [https://github.com//issues/224] with the .ui-select-match transclusion.

You also need to make sure that the templates are in the following order:
match, choices, select

<script type="text/ng-template" id="selectize/match.tpl.html">
    <div ng-hide="($select.open || $select.isEmpty())" class="ui-select-match" ng-transclude></div>
</script>

<script type="text/ng-template" id="selectize/choices.tpl.html">
    <div ng-show="$select.open" class="ui-select-choices selectize-dropdown single">
        <div class="ui-select-choices-content selectize-dropdown-content">
            <div class="ui-select-choices-group optgroup" role="listbox">
                <div ng-show="$select.isGrouped" class="ui-select-choices-group-label optgroup-header"
                     ng-bind="$group.name"></div>
                <div role="option" class="ui-select-choices-row"
                     ng-class="{active: $select.isActive(this), disabled: $select.isDisabled(this)}">
                    <div class="option ui-select-choices-row-inner" data-selectable></div>
                </div>
            </div>
        </div>
    </div>
</script>

<script type="text/ng-template" id="selectize/select.tpl.html">
    <div class="ui-select-container selectize-control single" ng-class="{'open': $select.open}">
        <div class="selectize-input"
             ng-class="{'focus': $select.open, 'disabled': $select.disabled, 'selectize-focus' : $select.focus}"
             ng-click="$select.activate()">
            <div class="ui-select-match"></div>
            <input type="text" autocomplete="off" tabindex="-1"
                   class="ui-select-search ui-select-toggle"
                   ng-click="$select.toggle($event)"
                   placeholder="{{$select.placeholder}}"
                   ng-model="$select.search"
                   ng-hide="!$select.searchEnabled || ($select.selected && !$select.open)"
                   ng-disabled="$select.disabled"
                   aria-label="{{$select.baseTitle}}">
        </div>
        <div class="ui-select-choices"></div>
    </div>
</script>

[martinoss]

@nasturah thanks, this is the only functioning workaround for me so far.

[audreyn]

I applied the fix mentionned here: #1325, but I still get the error: Error: [ui.select:choices] Expected multiple .ui-select-choices-row but got '0'. when I select an item on list. I think this is because in my template I use the group-by attribute. Does someone has the same issue ?

<ui-select multiple ng-model="data.attributes" theme="select2" id="cAttributes">
    <ui-select-match class="ui-select-match" placeholder="{{ 'select-attribute' | translate }}...">{{ $item.description | translate }}
    </ui-select-match>
    <ui-select-choices class="ui-select-choices" repeat="attribute.code as attribute in cAttributes | filter:$select.search"  group-by="'origin'">
         {{attribute.description}}
    </ui-select-choices>
</ui-select>

[chuckyblack]

@audreyn Yes, I have the same issue. It occurs only with group-by attribute.

[aronmgv]

Error: [ui.select:choices] Expected multiple .ui-select-choices-row but got '0'.
+1 (0.14.9, Angular 1.5.0)

@chuckyblack it does not.. I have it without group-by just using multiple and error gets generated insanely many times..

Also feeling up the choices feels extremely laggy compared to 0.13.2 and Angular 1.4.8.. It does not allow me to select/scroll until list is fully loaded.. which takes up to 3s for about 200 items.

<ui-select multiple ng-model="maintenance.devices">
    <ui-select-match class="ui-select-match" placeholder="select device...">
        {{$item.hostname}} ({{$item.ip}})
    </ui-select-match>
    <ui-select-choices class="ui-select-choices" repeat="ne in networkElements | filter: $select.search">
        <div ng-bind-html="ne.hostname | highlight: $select.search"></div>
        <div ng-bind-html="ne.ip | highlight: $select.search"></div>
    </ui-select-choices>
</ui-select>

Any solution at the moment? I applied those classes which did not solve the issue, just decreased the probability of the error..

Thanks, Michal

[iberodev]

I am also getting a Error: [ui.select:choices] Expected multiple .ui-select-choices-row but got '0'. without grouping by and feeling the select ui slower with 0.14.9 and Angular 1.5.0 than before.
The more times I click on the drop down to pick a different value, the worse it gets.. Something internally not being released?
The exception seems to happen rather randomly after changing the value picked a few times.

<div class="form-group">
                <div class="col-sm-offset-2 col-sm-10">
                    <ui-select ng-model="reg.model.countryCode" theme="bootstrap">
                        <ui-select-match placeholder="Select a country...">
                            <span ng-bind="$select.selected.name"></span>
                        </ui-select-match>
                        <ui-select-choices repeat="item.code as item in (reg.countries | filter: $select.search)">
                            <span ng-bind-html="item.name"></span>
                        </ui-select-choices>
                    </ui-select>
                </div>
            </div>

PS: It might be related to a conflict with other libraries? I am having issues (see #46) only within my application but not when I set up small test scenarios in plunker as

[curtismorte]

@realavaloro,
I ran into a very similar problem when I was trying to focus a ui-select as it became visible within the view (modal). Based on this comment, I was using the following code:

// get the ui select controller
var uiSelect = angular.element("#fooBar").controller('uiSelect');
// Open the select and focus:
uiSelect.activate();

Mistakenly, I forgot to add the focusser to the select before activating it. Which it turn was causing some of my issues with the dropdown being open before it's proper "user based" trigger sequence.

// focus the focusser, putting focus onto select but without opening the dropdown
uiSelect.focusser[0].focus();

Not sure if that helps, but something to consider.

After some additional findings, doing the above will open the ui-select (inside of a modal) the first time the modal is shown. The second time the modal is show I get the following error, but the ui-select still opens:
expected multiple .ui-select-choices-row but got '{0}'

[wesleycho]

Should note, that hack is not possible if you are using $compileProvider.debugInfoEnabled(false) for production builds.

This needs a Plunker reproduction though.

[glorko]

For me this problem started when I have included ngAnimate into my module

[ganqqwerty]

tried workaround, still have this problem in ui-select-choises without group by.

[maksad]

+1 same here

UPDATE
angular: 1.5.7
ui-select: 0.18.1

cc: @user378230

[user378230]

Please include your angular and ui select library versions if you're going to leave +1s...

Note only the latest version is supported and this issue still lacks a plunkr.

[imaksp]

I have made one sample working plunker using bootstrap modal(with angular 1.5.8, jQuery 3.1.0 bootstrap 3.3.7, ui-bootstrap 2.0.1, latest ui-select), those who are facing similar issue can try to regenerate issue in this.
https://plnkr.co/edit/K7XaKz?p=preview

[estundidher]

FROM:
<i class=\"caret pull-right\" ng-click=\"$select.toggle($event)\"></i>
TO:
<i class=\"caret pull-right\"></i>

This will resolve the issue when clicking on the ui-select arrow

[julien-vu]

The issue is still present in the 0.19.4 version

Angular 1.5.8
Angular Bootstrap : 2.1.2

EDIT : here is a plunkr with the issue

https://plnkr.co/edit/gnNLuuII55N4zb3paQtR?p=preview

[lizschwab]

Having this issue with ui-select version 0.11.2 after upgrading from AngularJS 1.4.8 to 1.5.8. Bootstrap version is 3.3.6.

Edit: here's a plunker with the issue I'm seeing. The field doesn't render at all. http://plnkr.co/edit/ZgqS05zgSgoEpvmks6io?p=preview

I'm not able to update the version of ui-select because I'm integrating code from another team so it would take months. They're on an older version of angular, so they don't have these issues.

[manveer19188]

Getting error "Error: [ui.select:transcluded] Expected 1 .ui-select-match but got '0'." with ui-select version 0.14.1 as using with Angular 1.6.1.

[manveer19188]

Finally resolved by adding the class ui-select-match and ui-select-choices to
<ui-select-match> and <ui-select-choices>
tags respectively.

[Jakobovski]

My error was caused by a validation directive on the form, once the validation directive was removed everything worked.

[exit99]

I still receive this error on 0.19.6 using kibana 6.2.3's filter_field_select.js file. Works if I remove the groupby