Ng2-select: allowClear does not show cross to delete entry

[carstenschaefer]

Hi there!
I've used the newest version 1.2.0 and it does not look like the example.

 <ng-select  [allowClear]="true"
                    [items]="control.data"
                    [placeholder]="control.default"
                    (selected)="control.selected($event)">
    </ng-select>

I am missing the cross to delete the selected entry,
And the triangle to open list is not placed at end of input box as seen in demo.

I've also tried adding your ng2-select.css from demo page, but without any success.

How can I fix this?

Regards
Carsten

[thedoctor46super]

It seems that this feature is not supported yet

[carstenschaefer]

yeah, I've seen this. but it works on demo page!

[wake42]

It tries to add an icon by adding the following classes: "glyphicon glyphicon-remove" so if you don't have glyphicons nothing will show, but you can define your own css classes to show something as a workaround.

[RomanNagornyi]

If you use bootstrap fa instead of glyphicon add this styles to ng2-select.css:

.glyphicon-remove { position: relative; } .glyphicon-remove:before { content: "\f00d"; font-family: FontAwesome; font-style: normal; font-weight: normal; text-decoration: inherit; color: #000; font-size: 15px; padding-right: 0.5em; position: absolute; top: 0px; left: -5px; }

[rejayi-experion]

Rather than ng2-select.css Write the below CSS in you _custom.css

.glyphicon-remove {
    position: relative  !important;
}
.glyphicon-remove:before {
    content: "\f00d"  !important;
    font-family: FontAwesome  !important;
    font-style: normal !important;
    font-weight: normal !important;
    text-decoration: inherit !important;
    color: #000 !important;
    font-size: 15px !important;
    padding-right: 0.5em !important;
    position: absolute !important;
    top: 0px !important;
    left: -5px !important;
}