Mat-sort not working inside an ngif

[Swoox]

Bug:

On the Mat-table the sort isn't working if it's inside an *ngIf.

What is the expected behavior?

The sort should work no matter if it's an ngIf or not.

What is the current behavior?

See bug.

What are the steps to reproduce?

https://stackblitz.com/edit/angular-27gm6u

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

I want to use another table style if I'm on my phone.

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

Tested it in chrome.
CDK/materials: 7.3.7
Angular: 7.2.5
Typescript: 3.1.1

Is there anything else we should know?

Probably it's also related to the filter and paginator not working.

[Antoniossss]

Sorting in stackblitz does not work with nor without ngIf.

[Swoox]

There is an console.log() if the ngIf is removed.
Edit I made it sort now.

[andrewseguin]

Inserting an *ngIf means that its contents cannot be queried until the view is initialized with change detection. This means the query for sort is empty at ngOnInit.

This can be resolved by changing the setup from ngOnInit to ngAfterViewInit. https://stackblitz.com/edit/angular-mewfek?file=src/app/app.component.ts

[angular-automatic-lock-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.}