Migrating angular-ui-bootstrap (ui.bootstrap) to modern Angular
ui.bootstrap gave AngularJS apps modals, dropdowns, tabs, datepickers and typeaheads without jQuery. It is tied to AngularJS and no longer maintained.
What replaces it
| Option | When to choose it |
|---|---|
| ng-bootstrap | Closest match: same Bootstrap look, native Angular components, no jQuery. |
| ngx-bootstrap | Good when you need to support older Bootstrap versions during the transition. |
| Angular Material / CDK | When the migration is also the moment to leave Bootstrap. |
How to migrate it
- List which widgets you actually use; most apps use only a handful of them.
- Start with $uibModal: it is usually called from many screens and its replacement (NgbModal or CDK Dialog) can be shared by new screens from day one.
- Migrate the remaining widgets screen by screen, together with the screen that uses them.
Watch out. Do not mix two UI kits on the same screen. Keep ui.bootstrap on legacy screens and the new kit on migrated ones until the last legacy screen is gone.
Other libraries
Planning a migration or a micro-frontend platform?
In a 20-minute call you describe your situation and I tell you how I'd approach it. If it isn't worth doing yet, I'll say so.
Message me on LinkedIn