Блог

Извините за глупый вопрос.

Предварительный просмотр не отображается, когда я создавал дочерние компоненты и помещал в них директиву следующим образом:

             <div *ngFor="let item of items"
                 cdkDropList
                 [cdkDropListConnectedTo]="id">
              <app-child1 [params]="params" *cdkDragPreview/>
              <app-child2 [params]="params" *cdkDragPreview/>
            </div>
  

Он работает правильно без дочернего компонента

Что здесь происходит?

Заранее спасибо!

cdkDragPreview должен находиться внутри родительского элемента с директивой cdkDrag, и у вас может быть только один cdkDragPreview (вместо двух, которые у вас есть). Смотрите пример:

  <div cdkDropList class="example-list" (cdkDropListDropped)="drop($event)">
  <div class="example-box" *ngFor="let movie of movies" cdkDrag>
    {{movie.title}}
    <img *cdkDragPreview [src]="movie.poster" [alt]="movie.title">
  </div>
</div>
  

Официальный пример Angular для cdkDragPreview