Невозможно выполнить привязку к cdkDragFreeDragPosition, так как это неизвестное свойство div

Я разместил свой код ниже. Я использую angular DragDropModule и по какой-то причине [cdkDragFreeDragPosition] не работает. это дает мне ошибку, показанную ниже. Я добавил DragDropModule в свой ngModule, как показано ниже. Когда я удаляю тег [cdkDragFreeDragPosition], перетаскивание работает нормально, но после добавления выдает ошибку, показанную ниже. [cdkDragStartDelay] = "1000" тоже выдает ту же ошибку. Я не знаю, почему возникает эта проблема. пытался найти решение в интернете, но не смог. Любая помощь будет оценена по достоинству.

<div class = "example-boundary">
<div class = "example-box"
     cdkDragBoundary = ".example-boundary"
     cdkDrag
     *ngFor = "let table of tables"
     id = "{{table._id}}"
     (cdkDragEnded) = "dragEnd($event)"
     [cdkDragDisabled] = "false"
     [cdkDragFreeDragPosition] = "getTablePosition(table)"
     (cdkDragMoved) = "dragMoved($event, table)">{{table.username}}
</div>

import { ServerOrderComponent } from './server-order/server-order.component';
import {DragDropModule} from '@angular/cdk/drag-drop';

@NgModule({
  imports: [
    MDBBootstrapModule.forRoot(),
    TranslateModule.forRoot({
      loader: {
        provide: TranslateLoader,
        useFactory: HttpLoaderFactory,
        deps: [HttpClient]
      }
    }),
    BrowserModule,
    ReactiveFormsModule,
    HttpClientModule,
    routing,
    FormsModule,
    NotifierModule.withConfig(customNotifierOptions),
    HttpModule,
    MatIconModule,
    BrowserAnimationsModule,
    MatSidenavModule,
    MatCheckboxModule,
    MatFormFieldModule,
    MatTableModule,
    MatSortModule,
    MatDividerModule,
    MatButtonToggleModule,
    MatProgressSpinnerModule,
    NgMultiSelectDropDownModule.forRoot(),
    DragDropModule
  ],
  entryComponents: [],
  declarations: [
    AppComponent,
    ServerOrderComponent
  ],
  providers: [
  ],
  bootstrap: [AppComponent]
})

export class AppModule {
}