SSR styles have precedent issues

Bug Report

What is the expected behavior?

Using [ngStyle.xs]=“{‘display’: ‘none’}” and [ngStyle.lg]=“{‘display’: ‘block’}” would create 2 @media styles for the 2 respective sizes.

What is the current behavior?

Actually, you get the 2 above plus an inline style ‘display’: ‘none’ that overrides everything. If I remove the inline style, the issue goes away and things appear to work as expected.

What are the steps to reproduce?

Providing a StackBlitz (or similar) is the best way to get the team to see your issue.

• StackBlitz starter using latest npm nightly release:

Hard to use a StackBlitz for this as it is an SSR related issue.

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

Avoid FOUC

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

Angular 8.2.9 Angular-Flex 8.0.0-beta.27 Angular Material 8.2.2 Typescript 3.5.3 Windows Chrome Latest (All Browsers woudl be affected)

Is there anything else we should know?

I have a feeling 'm doing something wrong here because I’ve tried a long list of ways to get SSR working as I would expect to no avail.

[rkajbaf]

Sorry to pile on here… but I see related looking issues in using ngShow/ngHide as well…

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