Skip to content

fix(select): support igx-select-item inside nested @for/@if control flow blocks - 20.1.x#17203

Open
Zneeky wants to merge 5 commits into20.1.xfrom
aahmedov/fix-select-control-flow-20.1.x
Open

fix(select): support igx-select-item inside nested @for/@if control flow blocks - 20.1.x#17203
Zneeky wants to merge 5 commits into20.1.xfrom
aahmedov/fix-select-control-flow-20.1.x

Conversation

@Zneeky
Copy link
Copy Markdown
Contributor

@Zneeky Zneeky commented Apr 17, 2026

Closes #

Additional information (check all that apply):

  • Bug fix
  • New functionality
  • Documentation
  • Demos
  • CI/CD

Checklist:

  • All relevant tags have been applied to this PR
  • This PR includes unit tests covering all the new code (test guidelines)
  • This PR includes API docs for newly added methods/properties (api docs guidelines)
  • This PR includes feature/README.MD updates for the feature docs
  • This PR includes general feature table updates in the root README.MD
  • This PR includes CHANGELOG.MD updates for newly added functionality
  • This PR contains breaking changes
  • This PR includes ng update migrations for the breaking changes (migrations guidelines)
  • This PR includes behavioral changes and the feature specification has been updated with them

Copilot AI review requested due to automatic review settings April 17, 2026 10:11
@Zneeky Zneeky added ❌ status: awaiting-test PRs awaiting manual verification select Select component version: 20.1.x labels Apr 17, 2026
Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR fixes igx-select rendering when igx-select-item (and groups) are placed inside nested Angular control-flow blocks (e.g. @for + @if/@else), where Angular content projection can fail to place nodes into the select’s scroll container.

Changes:

  • Add DOM-reconciliation logic in IgxSelectComponent to move unprojected select items/groups into the scroll container, preserving template order.
  • Add unit tests covering nested control flow scenarios for both plain items and grouped items.
  • Update the sample app to expose a Select sample route and include a demo section reproducing the nested control flow scenario.

Reviewed changes

Copilot reviewed 6 out of 6 changed files in this pull request and generated 2 comments.

Show a summary per file
File Description
src/app/select/select.sample.ts Adds sample data used by the new nested control-flow select demo.
src/app/select/select.sample.html Adds a demo <igx-select> using @for with nested @if/@else.
src/app/app.routes.ts Registers the Select sample route.
src/app/app.component.ts Adds “Select” to the sample app navigation.
projects/igniteui-angular/src/lib/select/select.component.ts Implements moveItemsToScrollContainer() and invokes it on init and content changes.
projects/igniteui-angular/src/lib/select/select.component.spec.ts Adds coverage for nested control-flow items/groups and dynamic changes.

Comment thread src/app/select/select.sample.html
Comment thread projects/igniteui-angular/src/lib/select/select.component.spec.ts
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

select Select component version: 20.1.x ❌ status: awaiting-test PRs awaiting manual verification

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants