mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-18 19:21:34 +08:00

Issue number: Resolves #19484 --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying. --> The Angular implementation of `ion-tabs` does not support conditional binding the `slot` property on `ion-tab-bar` or assigning a variable as the slot. For example, this usage is invalid: ```html <ion-tabs> <ion-tab-bar [slot]="slot"></ion-tab-bar> </ion-tabs> ``` This occurs because `ng-content` only supports static content projection. It is not intended for scenarios where the content can be relocated or conditionally rendered. An example of static content projection would be: ```html <ion-tabs> <ion-tab-bar slot="top"></ion-tab-bar> </ion-tabs> ``` ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - `ion-tabs` supports conditional slot bindings or a slot that is bound to a variable in Angular. The revised implementation relocates the tab bar in the `ion-tabs` template, based on it's current slot attribute. The implementation checks the tab bar slot whenever the content changes. ## Does this introduce a breaking change? - [ ] Yes - [x] No <!-- If this introduces a breaking change, please describe the impact and migration path for existing applications below. --> ## Other information <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> Dev-build: `7.0.11-dev.11685631370.18980633` --------- Co-authored-by: Liam DeBeasi <liamdebeasi@users.noreply.github.com>