Skip to content

feat(material/autocomplete): add MatAutocompleteSelectedTrigger for c…#33039

Open
lekhmanrus wants to merge 1 commit intoangular:mainfrom
lekhmanrus:feat/32931/autocomplete-custom-trigger
Open

feat(material/autocomplete): add MatAutocompleteSelectedTrigger for c…#33039
lekhmanrus wants to merge 1 commit intoangular:mainfrom
lekhmanrus:feat/32931/autocomplete-custom-trigger

Conversation

@lekhmanrus
Copy link
Copy Markdown
Contributor

Add an ng-template[matAutocompleteSelectedTrigger] directive that let consumers render arbitrary HTML in the trigger area after an option is selected, analogous to mat-select-trigger for mat-select. Since autocomplete writes to a native <input>, the implementation creates an Angular embedded view and inserts a wrapper <div> as a DOM sibling, hiding the input text via inline color: transparent. Clearing occurs on focus/click; the trigger is restored on blur when the input still contains the selected value's display text.

close #32931

@pullapprove pullapprove bot requested review from crisbeto and ok7sai April 7, 2026 06:48
…ustom selected-value display

Add an `ng-template[matAutocompleteSelectedTrigger]` directive that let
consumers render arbitrary HTML in the trigger area after an option is
selected, analogous to `mat-select-trigger` for `mat-select`. Since
autocomplete writes to a native `<input>`, the implementation creates an
Angular embedded view and inserts a wrapper `<div>` as a DOM sibling,
hiding the input text via inline `color: transparent`. Clearing occurs
on focus/click; the trigger is restored on blur when the input still
contains the selected value's display text.

close angular#32931

Signed-off-by: Ruslan Lekhman <lekhman112@gmail.com>
@lekhmanrus lekhmanrus force-pushed the feat/32931/autocomplete-custom-trigger branch from d8076c6 to 3968de0 Compare April 7, 2026 21:54
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

feat(mat-autocomplete): support custom ng-template for selected option

1 participant