Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Add ability to lazy render content for specific panel in case of nested expansion panels #14365

Closed
dbespalchuk opened this issue Dec 3, 2018 · 4 comments · Fixed by #14477
Closed

Add ability to lazy render content for specific panel in case of nested expansion panels #14365

dbespalchuk opened this issue Dec 3, 2018 · 4 comments · Fixed by #14477
Assignees
@crisbeto
Labels
area: material/expansion P3 An issue that is relevant to core functions, but does not impede progress. Important, but not urgent

Comments

@dbespalchuk
Copy link

Bug, feature request, or proposal:

Feature request

What is the expected behavior?

Only expansion panel that contains template with matExpansionPanelContent directive should lazy render it in case of a nested expansion panels.

What is the current behavior?

All parent expansion panels render matExpansionPanelContent template of child panel if they don't contain any specific template for themself.

What are the steps to reproduce?

StackBlitz reproduction: https://stackblitz.com/edit/angular-material2-issue-fa7h1c

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

There is a case where I have to use nested expansion panels with lazy rendering for different content blocks in the child expansion panels. If I want to render content properly, then I also have to make all parent expansion panels content lazy rendered.

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

Angular 6.1.1
Material 6.4.2
TypeScript 2.9.2

Is there anything else we should know?

This issue can be also reproduced on the latest versions of Angular and Material
@josephperrott josephperrott added feature This issue represents a new feature or feature request rather than a bug or bug fix P5 The team acknowledges the request but does not plan to address it, it remains open for discussion labels Dec 3, 2018
@VitalyVrublevskyy
Copy link

I have the same problem. Looks like cause of problem hidden here: https://github.com/angular/material2/blob/63be232283262615fa2130900c80dd570eff6cda/src/lib/expansion/expansion-panel.ts#L107:L108.
We should take into account only appropriate @ContentChild only for particular level of Accordion.

@crisbeto crisbeto self-assigned this Dec 11, 2018
@crisbeto crisbeto added has pr P3 An issue that is relevant to core functions, but does not impede progress. Important, but not urgent and removed P5 The team acknowledges the request but does not plan to address it, it remains open for discussion feature This issue represents a new feature or feature request rather than a bug or bug fix labels Dec 11, 2018
crisbeto added a commit to crisbeto/material2 that referenced this issue Dec 11, 2018
@crisbeto
fix(expansion-panel): picking up lazy content from child component
fa136cc 
We use a `ContentChild` to determine what lazy content to render inside an expansion panel. When the lazy content is nested further down inside another expansion panel, all ancestor panels up the tree will pick up the lowest lazy content from the lowest level. These changes add a check to ensure that the lazy content is rendered out by the closest panel.

Fixes angular#14365.
@crisbeto crisbeto mentioned this issue Dec 11, 2018
Merged
@kvloover
Copy link

ran into this as well, fix would be appreciated

crisbeto added a commit to crisbeto/material2 that referenced this issue Apr 3, 2019
@crisbeto
fix(expansion-panel): picking up lazy content from child component
225535d 
We use a `ContentChild` to determine what lazy content to render inside an expansion panel. When the lazy content is nested further down inside another expansion panel, all ancestor panels up the tree will pick up the lowest lazy content from the lowest level. These changes add a check to ensure that the lazy content is rendered out by the closest panel.

Fixes angular#14365.
crisbeto added a commit to crisbeto/material2 that referenced this issue Jun 2, 2019
@crisbeto
fix(expansion-panel): picking up lazy content from child component
92dab0e 
We use a `ContentChild` to determine what lazy content to render inside an expansion panel. When the lazy content is nested further down inside another expansion panel, all ancestor panels up the tree will pick up the lowest lazy content from the lowest level. These changes add a check to ensure that the lazy content is rendered out by the closest panel.

Fixes angular#14365.
crisbeto added a commit to crisbeto/material2 that referenced this issue Jun 20, 2019
@crisbeto
fix(expansion-panel): picking up lazy content from child component
fc46f85 
We use a `ContentChild` to determine what lazy content to render inside an expansion panel. When the lazy content is nested further down inside another expansion panel, all ancestor panels up the tree will pick up the lowest lazy content from the lowest level. These changes add a check to ensure that the lazy content is rendered out by the closest panel.

Fixes angular#14365.
crisbeto added a commit to crisbeto/material2 that referenced this issue Sep 21, 2019
@crisbeto
fix(expansion-panel): picking up lazy content from child component
d224dcf 
We use a `ContentChild` to determine what lazy content to render inside an expansion panel. When the lazy content is nested further down inside another expansion panel, all ancestor panels up the tree will pick up the lowest lazy content from the lowest level. These changes add a check to ensure that the lazy content is rendered out by the closest panel.

Fixes angular#14365.
crisbeto added a commit to crisbeto/material2 that referenced this issue Dec 31, 2019
@crisbeto
fix(expansion-panel): picking up lazy content from child component
129c9f3 
We use a `ContentChild` to determine what lazy content to render inside an expansion panel. When the lazy content is nested further down inside another expansion panel, all ancestor panels up the tree will pick up the lowest lazy content from the lowest level. These changes add a check to ensure that the lazy content is rendered out by the closest panel.

Fixes angular#14365.
crisbeto added a commit to crisbeto/material2 that referenced this issue Mar 11, 2020
@crisbeto
fix(expansion-panel): picking up lazy content from child component
4e482ba 
We use a `ContentChild` to determine what lazy content to render inside an expansion panel. When the lazy content is nested further down inside another expansion panel, all ancestor panels up the tree will pick up the lowest lazy content from the lowest level. These changes add a check to ensure that the lazy content is rendered out by the closest panel.

Fixes angular#14365.
@crisbeto crisbeto mentioned this issue May 5, 2020
Closed
@crmarques
Copy link

Same problem with version 9.2.4.

crisbeto added a commit to crisbeto/material2 that referenced this issue Mar 1, 2022
@crisbeto
fix(material/expansion-panel): picking up lazy content from child com…
f8c4d28 
…ponent

We use a `ContentChild` to determine what lazy content to render inside an expansion panel. When the lazy content is nested further down inside another expansion panel, all ancestor panels up the tree will pick up the lowest lazy content from the lowest level. These changes add a check to ensure that the lazy content is rendered out by the closest panel.

Fixes angular#14365.
crisbeto added a commit to crisbeto/material2 that referenced this issue Mar 1, 2022
@crisbeto
fix(material/expansion): picking up lazy content from child component
91aaa06 
We use a `ContentChild` to determine what lazy content to render inside an expansion panel. When the lazy content is nested further down inside another expansion panel, all ancestor panels up the tree will pick up the lowest lazy content from the lowest level. These changes add a check to ensure that the lazy content is rendered out by the closest panel.

Fixes angular#14365.
crisbeto added a commit to crisbeto/material2 that referenced this issue Mar 1, 2022
@crisbeto
fix(material/expansion): picking up lazy content from child component
7dac26d 
We use a `ContentChild` to determine what lazy content to render inside an expansion panel. When the lazy content is nested further down inside another expansion panel, all ancestor panels up the tree will pick up the lowest lazy content from the lowest level. These changes add a check to ensure that the lazy content is rendered out by the closest panel.

Fixes angular#14365.
crisbeto added a commit that referenced this issue Mar 1, 2022
@crisbeto
fix(material/expansion): picking up lazy content from child component (…
64c2d31 
…#14477)

We use a `ContentChild` to determine what lazy content to render inside an expansion panel. When the lazy content is nested further down inside another expansion panel, all ancestor panels up the tree will pick up the lowest lazy content from the lowest level. These changes add a check to ensure that the lazy content is rendered out by the closest panel.

Fixes #14365.
@angular-automatic-lock-bot
Copy link

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Apr 1, 2022
forsti0506 pushed a commit to forsti0506/components that referenced this issue Apr 3, 2022
@crisbeto @forsti0506
fix(material/expansion): picking up lazy content from child component (…
c573f1c 
…angular#14477)

We use a `ContentChild` to determine what lazy content to render inside an expansion panel. When the lazy content is nested further down inside another expansion panel, all ancestor panels up the tree will pick up the lowest lazy content from the lowest level. These changes add a check to ensure that the lazy content is rendered out by the closest panel.

Fixes angular#14365.
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Assignees

@crisbeto crisbeto

Labels
area: material/expansion P3 An issue that is relevant to core functions, but does not impede progress. Important, but not urgent
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

fix(material/expansion): picking up lazy content from child component crisbeto/material2
7 participants
@crmarques @crisbeto @VitalyVrublevskyy @josephperrott @kvloover @andrewseguin @dbespalchuk