title: angular drag and drop cdk doesn't work in angular material dialog
body: <p>I want to change list order by drag and drop CDK of angular.
  It works on any page in my website, but when I use it inside a material dialog it doesn't work.
  When I drag a list item over another item, it doesn't change position on dragging over, also not on drop.
  Is there anything special to do to make it work inside the dialog?</p>
  
  <p>simplest code that I am trying:</p>
  
  <p>HTML</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;div cdkDropList (cdkDropListDropped)="drop($event)"&gt;
    &lt;div cdkDrag *ngFor="let n of numbers"&gt;
      {{n}}
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>ts file</p>
  
  <pre><code>import { CdkDragDrop, moveItemInArray } from '@angular/cdk/drag-drop';
  
  numbers: number[]= [];
  
  constructor() {
    this.n.push(2,3,4,5);
  }
  
  drop(event: CdkDragDrop&lt;number[]&gt;) {
    moveItemInArray(this.numbers, event.previousIndex, event.currentIndex);
  }
  </code></pre>
  
  <p>app.module.ts</p>
  
  <pre><code>import { DragDropModule } from '@angular/cdk/drag-drop';
  
  @NgModule({ imports: [..., DragDropModule]})
  </code></pre>
  
  <p>As I said, this code works in any place in any page, but when i copy it to dialog component it does not work</p>