Components: bug: ngIf disables cdkDropListConnectedTo

[bbogdanov]

Bug, feature request, or proposal:

Bug

What is the expected behavior?

Having the possibility of drag and drop items from one list container to another.

What is the current behavior?

Enable to drag from both list, unenable to move item from list to another list.

What are the steps to reproduce?

By adding ngIf directive on both lists.

https://stackblitz.com/edit/angular-material-todo-dragndrop?file=app%2Fcdk-drag-drop-connected-sorting-example.html

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

Showing a list when it has received items and also if there are any other lists the user to be able to move the items between these lists.

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

All the versions are listed in the stackbliz example.

Is there anything else we should know?

I don't have time rn to check why, but I think it is related to TemplateRef.

I searched in the issues I didn't find any related issues so if there is one I am sorry.

[crisbeto]

It's because the *ngIf turns it into an ng-template. You can work around it by using a string ID instead. We also have https://github.com/angular/material2/pull/13754 coming up which will make it easier to connect drop containers. Closing the issue since there isn't much we can do about it on our end.

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