The ng2-auto-complete results appear to be lengthy. When I try to inspect and apply some CSS, the results disappear upon clicking. To address this issue, I experimented with the following code:
ng2-auto-complete{
height: 400px;
overflow-y: scroll;
overflow-x: hidden;
}
Although this solution worked for me, a fixed scroll bar always remained at the specified height. How can this bug be resolved? Are there any alternative methods?
Refer to the example below, where the persistent vertical scroll bar is evident.
View the image here: https://i.sstatic.net/XhzvK.png
Inspect the code snippet below:
<div _ngcontent-c14="" class="form-group">
<label _ngcontent-c14="">Language
<span _ngcontent-c14="" class="required">*</span>
</label>
<div _ngcontent-c14="">
<div class="ng2-auto-complete-wrapper" style="position: relative;">
<input _ngcontent-c14="" class="form-control ng-valid ng-touched ng-dirty" display-property-name="TextField" name="ng2autoLanguage" ng2-auto-complete="" placeholder="Enter your language" value-property-name="ValueField" ng-reflect-klass="form-control" ng-reflect-ng-class="" ng-reflect-name="ng2autoLanguage" ng-reflect-source="function () { [native code] }" ng-reflect-display-property-name="TextField" ng-reflect-list-formatter="function (data) {
" ng-reflect-model="" ng-reflect-ng-model="">
</div>
</div>
</div>