I am using Angular 6, ng2-select is not showing any data

[ChandraTerli]

I started with a new project and using angular 6, tried to use ng2-select but after binding the data it does not show in the dropdown. when I look at element in dev tools I see the data bind but it dows not pull on the ui. here is my simple code.. <ng-select [multiple]="true" [allowClear] [items]="items"
placeholder="No item selected"> items: Array

[BenjaminRichardson]

Can you create a plunkr, stackblitz, etc. which shows the problem?

[joelebeau1]

I'm also experiencing this issue right now, using the element as follow:

<ng-select [items]="items" [disabled]="isSubmitting" [active]="active" (data)="refreshValue($event)" (selected)="selected($event)" (removed)="removed($event)" (typed)="typed($event)" placeholder="Search..."></ng-select>

The select element has a charcoal-grey background and white text when not active, which may be an unrelated issue, but typing in the search input doesn't display any items even though I can inspect the component using Augury (Chrome extension for Angular dev) and see that the items are being returned correctly by my service.

Oddly enough, if I hit enter while focused on the ng2-select element it does set the first item as selected and displays that item's text, I just can't see the search results to choose from.

[ChandraTerli]

I am not sure how to create it on plunkr as requested by BenjaminRichards

[jcompagner]

i think the problem is that you are using bootstrap 4.x this works fine: https://stackblitz.com/edit/angular-ghvjfm

but if you would change that it used 4x instead of 3.x then it doesn't work anymore

That is also a problem for us because we build fully now in bootstrap 4.

[ChandraTerli]

You were saying that it does not work on bootstrap 4.x, correct?

[jcompagner]

yes then it doesn't work if i switch between 3 and 4 then 3 works, and 4 gives me that dark gray thing and no popup its just a big styling problem

[beshad]

same issue here, i m using bootstrap 4 and this only shows a black box.

[RolfVeinoeSorensen]

Most likely related to this `.open {

.dropdown-menu { display: block; }

a { outline: 0; } }`

[goodiet]

I was able to get the dropdown showing with the following overriding CSS: .open.dropdown .dropdown-menu { display: block; transform: none; }

[GazousGit]

Hello, I'm using the bootstrap 4 as well, I manage to set up select multiple with dynamic items however the match-item don't use the correct style and button:

Any idea how I could override the button style for match-item ? :-)

[gitaagit02]

Most likely related to this `.open {

.dropdown-menu { display: block; }

a { outline: 0; } }`

I still can't show the list. Anyone knows the answer? :( help meeee

[vimmisinghani]

any solution for this issue??

[vimmisinghani]

I set display = 'block' when textbox is typed public typed(value:any) : void { let el:HTMLElement = document.getElementsByClassName("ui-select-choices dropdown-menu")[0] as HTMLElement; if (typeof el !== 'undefined') { el.style.display = 'block'; } }