Components: Datepicker Positioning is inaccurate after upgrade

[vibingopal]

Bug, feature request, or proposal:

Hi Team,

I have upgraded my application to the latest release of material 2 and the existing components like date picker is not properly positioned.
I can see the position of the date picker is left of the page instead of the input element. It was working fine till last release 2.0.0-beta.8

What is the expected behavior?

Date picker should render properly on position

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

Material - 2.0.0-beta.10
Angular - 4

Is there anything else we should know?

Do we need to change anything explicitly

[tinayuangao]

@mmalerba Is this intended behavior?

[mmalerba]

@vibingopal can you provide a plunker demonstrating this issue? It seems to be working fine to me: http://plnkr.co/edit/d0kzAwB87YPTSat2tWDx?p=preview

[vibingopal]

Thank you @mmalerba for your example.But the alignment of the date picker on my app is showing extreme left. I am not referring to material js file as mentioned. My component directly picks the library from node modules.

[willshowell]

@vibingopal are you changing the styling of the MdInput at all? I think this happens if you apply display: none to the underline since the popup uses the underline for alignment.

[vibingopal]

Yes @Willshowell. You are right.I am removing the second underline of the form field with date picker. I don't want to show two lines on the input field

[willshowell]

@vibingopal What do you mean by second underline? Try just setting the opacity to 0 instead.

@mmalerba I saw this on SO a while back and I think several folks are doing it. What about switching the connection ref to the input's _connectionContainerRef and maybe updating the popup's PositionStrategy?

[vibingopal]

I understand the problem now @willshowell . Thank you for your help. Before in the older version of material beta i used to update the position strategy explicitly in the dependency. After the upgrade to latest version , the configuration is overidden. Will keep a note on this. Thanks again.

[guntram]

@willshowell

are you changing the styling of the MdInput at all? I think this happens if you apply display: none to the underline since the popup uses the underline for alignment.

this is not very transparent in the docs ;)

[angular-automatic-lock-bot[bot]]

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._}