问题
I am using Angular Material 7's Drag and Drop library, and I am trying to figure out how to use the cdkDragPlaceholder.
CdkDragPlaceholder
Element that will be used as a template for the placeholder of a CdkDrag when it is being dragged. The placeholder is displayed in place of the element being dragged.
Selector: ng-template[cdkDragPlaceholder]
I have tried the following code (see Stackblitz):
<div class="example-box" *ngFor="let movie of movies" cdkDrag>
<div class="example-custom-placeholder" *cdkDragPlaceholder>asd</div>
{{movie}}
</div>
but there are no placeholders when dragging. If I wrap the above code inside a div with the cdkDropList-directive however I am able to see the placeholder. What can I do to make sure I use the placeholder correctly, only for an element with the cdkDrag-directive attached to it (not necesseraly using a cdkDragList).
回答1:
It seems like the feature you're looking for may not be available yet.
I tested this too, and trying to use a *cdkDragPlaceholder element without creating a cdkDropList doesn't appear to appear to work. The docs don't make this distinction, but they also don't provide any examples of placeholders working outside of a list.
You might keep an eye on this GitHub issue, as it seems to be asking for the feature you're trying to implement.
Good luck!
来源：https://stackoverflow.com/questions/54549461/how-to-use-a-placeholder-for-angular-material-7-drag-and-drop