Open mukuljai opened 2 years ago
I've also experienced this issue.
The documentation is displaying the typeahead correctly: https://valor-software.com/ngx-bootstrap/#/typeahead#Basic-array
I'm using ngx-bootstrap version 7.1.0 as it is the latest one available on npm. The documentation is supposedly using ngx-bootstrap version 7.1.2, although I'm unable to switch to older versions in the documentation to verify that 7.1.2 fixes the issue.
Opening the stackblitz link for the basic array example leads to a stackblitz using version 7.1.1. If I switch to version 7.0.0 there, the typeahead is displayed correctly again.
The stackblitz is using Angular 12.1.0 and Bootstrap 3.3.7
Hi, mukuljai!) We can't reproduce this issue locally. Can you, please, add reproducing it on stackblitz, or make a video of getting such issue, or just send us steps to reproduce? thank you for using our library)
@apotapcukv As I mentioned in my last comment, you can just change the ngx-bootstrap version in the example-stackblitz. I created a stackblitz with those changes, that shows the issue: https://stackblitz.com/edit/angular-c8mbwt?file=main.ts
@apotapcukv any update on this?
Checked typeahead code, could find below code may actually causing this, though not sure for isBs3=true too why showing as buttons? -
https://github.com/lukasz-madej/ngx-bootstrap/blob/development/src/typeahead/typeahead-container.component.html
can clearly see the difference -
<ng-template #bs4Template>
<button #liElements
......
<ng-template #bs3Template>
<li #liElements
.....
Pls provide fix this asap.
I faced up the same problem a I thinks is a configuration problem. You have to set the bootstrap version to bs3
The problem comes from trying to guess the version of bootstrap used from the styles. From what I have read in the documentation it can fail and you have the option of doing the "set" manually.
I think the issue can be closed :)
This change leads to issues in ngx-bootstrap 10 because with ngx-bootstrap 10 I'm no longer able to setTheme('bs3') -> only 'bs4' and 'bs5' which are using <button> <li>
Bug description: Facing issue with typeahead with ngx-bootstrap @7.1.2 whereas it works fine with 7.0.0
Issue: using typeahead as below.
Now with 7.1.2, it shows up in UI the dropdown list items as buttons and instead of showing as list item. The html conversion looks like
<buttons> instead of <ul><li>...
Walk through the changes but not getting what change it has caused in typeahead module.
Versions of ngx-bootstrap, Angular, and Bootstrap: ngx-bootstrap: 7.1.2 Angular:11 Bootstrap:3:
Build system: Angular CLI, System.js, webpack, starter seed:
Expected behavior
Should show as list item instead of buttons in dropdown.