Error when trying to use p-Dropdown from PrimeNG in application

Question

I want to use this PrimeNG-Dropdown in my application. So what I did:

npm i primeng --save

Then I added the DropdownModule in my imports from app.module.ts. Afterwards, I included the following code in my html:

<p-dropdown [options]="optionList" [(ngModel)]="selectionString" placeholder="Choose one"></p-dropdown>

On running ng serve and starting localhost:4200 I get the following error:

./node_modules/primeng/components/multiselect/multiselect.js Module not found: Error: Can't resolve '@angular/cdk/scrolling' in '%projectroot%\node_modules\primeng\components\multiselect'

I also tried removing the import from the imports-Array, which resulted in a different error. What am I doing wrong? I am using Angular 7 btw.

When removing the import I get the following error:

Can't bind to 'options' since it isn't a known property of 'p-dropdown'.
1. If 'p-dropdown' is an Angular component and it has 'options' input, then verify that it is part of this module.
2. If 'p-dropdown' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.
3. To allow any property add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component. ("
      <p-dropdown [ERROR ->][options]="optionList" [(ngModel)]="selectionString" placeholder="Choose one"></p-dropdown"): ng:///AppModule/ProjectGeneratorComponent.html@13:18
'p-dropdown' is not a known element:
1. If 'p-dropdown' is an Angular component, then verify that it is part of this module.
2. If 'p-dropdown' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message. ("
      [ERROR ->]<p-dropdown [options]="optionList" [(ngModel)]="selectionString" placeholder="Choose one">"): 

Answer 1

You need to install Angular CDK. use npm install @angular/cdk --save command.

and then import multi selecte module in appModule using

import {MultiSelectModule} from 'primeng/multiselect';