Skip to content

Conversation

@emoralesb05
Copy link
Contributor

@emoralesb05 emoralesb05 commented Mar 15, 2017

When changing the width of the md-select (e.g. using flex box) after its rendered, the template[cdk-connected-overlay] does not update its minWidth and keeps the initial minWidth every time its opened. (somewhat the same issue as #3573)

This issue partially happens because the cdk-connected-overlay sets the width, minWidth, etc etc only once and never updates it again.

https://github.com/angular/material2/blob/master/src/lib/core/overlay/overlay-directives.ts#L181

But also because the _triggerWidth property in md-select is never updated either.

Here is a plnkr to demonstrate the issue: http://plnkr.co/edit/ERg71p?p=preview

Steps to reproduce

  • Change the width of the md-select component by entering a diff value in the width input box under it. (both single and multiple md-select's will change)
  • Open either md-select, and notice the width of the cdk-overlay-pane remained the same as when it was initially rendered.

Proposed fix in PR

We just need to set the new _triggerWidth every time the md-select is opened (open()) taking into account dir/offsetX and update the overlayRef#OverlayState in ConnectedOverlayDirective when the template is attached.

https://github.com/angular/material2/blob/master/src/lib/core/overlay/overlay-directives.ts#L188-L202

emoralesb05 added 2 commits March 15, 2017 11:00
when changing the width of the `host` (or using flex box) the `div.cdk-overlay-pane` keeps the initial width
@googlebot googlebot added the cla: yes PR author has agreed to Google's Contributor License Agreement label Mar 15, 2017
@emoralesb05
Copy link
Contributor Author

@crisbeto not sure if this PR affects #3228 and #3247.. or the vision for how it should work

@jelbourn jelbourn requested a review from kara March 20, 2017 22:05
@kara
Copy link
Contributor

kara commented Aug 15, 2017

@emoralesb05 Is this still an issue with the current version? If so, would you mind rebasing? Sorry for the late review.

@kara kara assigned emoralesb05 and unassigned kara Aug 15, 2017
@emoralesb05
Copy link
Contributor Author

@kara yes its still an issue, i updated the plnkr with the latest version to try it.

Rebasing it so we can hopefully merge it soon 😄

@kara
Copy link
Contributor

kara commented Aug 15, 2017

OK, ping me when it's ready for review again :)

@emoralesb05
Copy link
Contributor Author

Im actually gonna create another PR since rebasing 5-6 months worth of code is taking its toll on me haha 😂 ..

@kara
Copy link
Contributor

kara commented Aug 15, 2017

Haha, fair enough. Ping me when your new PR is ready, and I'll review ASAP to avoid more conflicts.

@emoralesb05
Copy link
Contributor Author

@kara i opened #6489 so we can continue in that one 😄

Closing this one

@emoralesb05 emoralesb05 deleted the select-dyn-width branch August 15, 2017 23:42
@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 Sep 6, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Labels

cla: yes PR author has agreed to Google's Contributor License Agreement

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants