{"action":"created","issue":{"url":"https://api.github.com/repos/angular-ui/ui-select/issues/1126","labels_url":"https://api.github.com/repos/angular-ui/ui-select/issues/1126/labels{/name}","comments_url":"https://api.github.com/repos/angular-ui/ui-select/issues/1126/comments","events_url":"https://api.github.com/repos/angular-ui/ui-select/issues/1126/events","html_url":"https://github.com/angular-ui/ui-select/issues/1126","id":99344152,"number":1126,"title":"When ui-select is inside a modal popup, items do not show up properly","user":{"login":"pierznj","id":8969590,"avatar_url":"https://avatars.githubusercontent.com/u/8969590?v=3","gravatar_id":"","url":"https://api.github.com/users/pierznj","html_url":"https://github.com/pierznj","followers_url":"https://api.github.com/users/pierznj/followers","following_url":"https://api.github.com/users/pierznj/following{/other_user}","gists_url":"https://api.github.com/users/pierznj/gists{/gist_id}","starred_url":"https://api.github.com/users/pierznj/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/pierznj/subscriptions","organizations_url":"https://api.github.com/users/pierznj/orgs","repos_url":"https://api.github.com/users/pierznj/repos","events_url":"https://api.github.com/users/pierznj/events{/privacy}","received_events_url":"https://api.github.com/users/pierznj/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"milestone":null,"comments":2,"created_at":"2015-08-06T03:13:35Z","updated_at":"2015-08-12T01:31:55Z","closed_at":null,"body":"I'm experiencing the same problem as described here:\r\nhttp://stackoverflow.com/questions/29893423/angular-ui-select-is-not-displaying-the-list-of-options-when-included-in-angular\r\nThe second answer to that issue appears to be correct. For some reason, the $select.items.length is 0, causing the dropdown list to be ng-hidden, even though the items are there (and can be seen if you inspect the DOM). Only solution appears to be hacking the template, as is suggested in the above SO post. "},"comment":{"url":"https://api.github.com/repos/angular-ui/ui-select/issues/comments/130130824","html_url":"https://github.com/angular-ui/ui-select/issues/1126#issuecomment-130130824","issue_url":"https://api.github.com/repos/angular-ui/ui-select/issues/1126","id":130130824,"user":{"login":"noblebright","id":6426637,"avatar_url":"https://avatars.githubusercontent.com/u/6426637?v=3","gravatar_id":"","url":"https://api.github.com/users/noblebright","html_url":"https://github.com/noblebright","followers_url":"https://api.github.com/users/noblebright/followers","following_url":"https://api.github.com/users/noblebright/following{/other_user}","gists_url":"https://api.github.com/users/noblebright/gists{/gist_id}","starred_url":"https://api.github.com/users/noblebright/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/noblebright/subscriptions","organizations_url":"https://api.github.com/users/noblebright/orgs","repos_url":"https://api.github.com/users/noblebright/repos","events_url":"https://api.github.com/users/noblebright/events{/privacy}","received_events_url":"https://api.github.com/users/noblebright/received_events","type":"User","site_admin":false},"created_at":"2015-08-12T01:31:55Z","updated_at":"2015-08-12T01:31:55Z","body":"I got this to work by altering the template in a hacky way.  You can see below that I switched from using ng-show to a bound expression in the style attribute.  \r\n\r\n```\r\nstyle=\"display:{{$select.items.length && $select.open ? \\'block\\':\\'none\\'}}\"\r\n```\r\n\r\nEarlier, I had tried ng-hide, ng-show, and ng-class, and none of them worked.  I wonder if this has to do with some kind of ng-animate behavior?\r\n\r\nFull copy/paste available below: (adjust the theme prefix as necessary)\r\n```\r\n.run(function ($templateCache) {\r\n  $templateCache.put('bootstrap/choices.tpl.html',\r\n      '<ul class=\"ui-select-choices ui-select-choices-content dropdown-menu\" role=\"listbox\" style=\"display:{{$select.items.length && $select.open ? \\'block\\':\\'none\\'}}\" >' +\r\n          '<li class=\"ui-select-choices-group\" id=\"ui-select-choices-{{ $select.generatedId }}\">' +\r\n            '<div class=\"divider\" ng-show=\"$select.isGrouped && $index > 0\"></div>' +\r\n            '<div ng-show=\"$select.isGrouped\" class=\"ui-select-choices-group-label dropdown-header\" ng-bind=\"$group.name\"></div>' +\r\n            '<div id=\"ui-select-choices-row-{{ $select.generatedId }}-{{$index}}\" class=\"ui-select-choices-row\" ' +\r\n              'ng-class=\"{active: $select.isActive(this), disabled: $select.isDisabled(this)}\" role=\"option\">' +\r\n                '<a href=\"javascript:void(0)\" class=\"ui-select-choices-row-inner\"></a>' +\r\n            '</div>' +\r\n          '</li>' +\r\n      '</ul>');\r\n});\r\n```"}}