primeng appendto

 <div class="container-fluid" #parentDiv>

  <div class="row">

    <mat-toolbar color="primary">

      <span (click)="openHomePage($event)">Student management System</span>

      <span class="example-spacer"></span>

      <p-dropdown [options]="listItems" [(ngModel)]="selectedItem" [appendTo]="parentDiv" placeholder="Select Year Period"

                  (onChange)="valueOnChange($event)" dataKey="value">

        <ng-template let-item pTemplate="selectedItem">

          <div class="option-wrapper">

            <span class="option-value">{{selectedItem}}</span>&nbsp;

          </div>

        </ng-template>

        <ng-template let-object pTemplate="item">

          <div class="option-wrapper">

            <span class="option-value">{{object.value}}</span>&nbsp;

            <mat-icon class="option-icon">{{object.label}}</mat-icon>

          </div>

        </ng-template>

      </p-dropdown>

      </mat-toolbar>

  </div>

</div>