Skip to content

feat(expansion-panel): allow two-way binding on 'expanded' property #9311

@okeydoky

Description

@okeydoky

Bug, feature request, or proposal:

feature

What is the expected behavior?

allow two way binding on panel's expanded property

What is the current behavior?

Currently, 'expanded' is only an Input

What is the use-case or motivation for changing an existing behavior?

Right now, when we try to open/close panel programatically, we usually do something like:
<mat-expansion-panel [expanded]="isExpanded" (opened)="setExpanded(true)" (closed)="setExpanded(false)">

We cannot just set the model's property and rely on Angular's change detection to update the view because when a user interact with the UI, the expanded property value does not update on model's isExpanded property. We will need to bind opened and closed to update model to keep them in sync.

It would be nice and neat if we can somehow do this:
<mat-expansion-panel [(expanded)]="isExpanded">

then in the model file, we can just work on the isExpanded property without worrying that it might be out of sync with the view.

Metadata

Metadata

Assignees

Labels

P4A relatively minor issue that is not relevant to core functionsfeatureThis issue represents a new feature or feature request rather than a bug or bug fixhelp wantedThe team would appreciate a PR from the community to address this issue

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions