Skip to content

Commit 6045a0c

Browse files
authored
fix(material/chips): ensure that edit input query is re-evaluated on time (#27465)
Fixes an issue that showed up in an internal app where the edit input query wasn't being evaluated on time which led to a runtime error. Fixes #27462.
1 parent c3f2a97 commit 6045a0c

File tree

1 file changed

+8
-4
lines changed

1 file changed

+8
-4
lines changed

src/material/chips/chip-row.ts

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -178,9 +178,14 @@ export class MatChipRow extends MatChip implements AfterViewInit {
178178
// The value depends on the DOM so we need to extract it before we flip the flag.
179179
const value = this.value;
180180

181-
this._isEditing = true;
182-
this._editStartPending = true;
181+
this._isEditing = this._editStartPending = true;
183182

183+
// Starting the editing sequence below depends on the edit input
184+
// query resolving on time. Trigger a synchronous change detection to
185+
// ensure that it happens by the time we hit the timeout below.
186+
this._changeDetectorRef.detectChanges();
187+
188+
// TODO(crisbeto): this timeout shouldn't be necessary given the `detectChange` call above.
184189
// Defer initializing the input so it has time to be added to the DOM.
185190
setTimeout(() => {
186191
this._getEditInput().initialize(value);
@@ -189,8 +194,7 @@ export class MatChipRow extends MatChip implements AfterViewInit {
189194
}
190195

191196
private _onEditFinish() {
192-
this._isEditing = false;
193-
this._editStartPending = false;
197+
this._isEditing = this._editStartPending = false;
194198
this.edited.emit({chip: this, value: this._getEditInput().getValue()});
195199

196200
// If the edit input is still focused or focus was returned to the body after it was destroyed,

0 commit comments

Comments
 (0)