Currently, to change active tab programmatically we have to call
activeId property does not work for this purpose.
This causes issues in certain scenarios. For example, in a “truly” reactive app, we have to not only manually
subscribe() to update the active tab instead of using data binding, we also have to call
select() on the next JS event cycle (see the demo below). I’m not sure about the latter, but the former makes API not very reactive and Angular-friendly.
Also, we have to write extra code in a component (and in some cases in a template as well) just to get access to
NgbTabset instance like this:
@ViewChild(NgbTabset) private tabset: NgbTabset;
Conversely, Material MatTabGroup has this feature (
selectedIndex property) and could be a good example here.
Link to minimally-working plunker that reproduces the issue:
Version of Angular, ng-bootstrap, and Bootstrap: