title: Primeng p-dropdown should close on scrolling document page
body: <p>Had p-dropdown which is inside p-table as column header. While scrolling p-table, p-dropdown should close.</p>
  
  <pre><code>&lt;p-table #dTable [columns]="cols"&gt;
  &lt;ng-template pTemplate="header"&gt;
    &lt;tr class="table-header-row"&gt;
      &lt;th *ngFor="let col of cols" [ngStyle]="{'width': col.widthPer ? col.widthPer + '%' : col.widthPx + 'px'}"&gt;
        {{col.header}}
      &lt;/th&gt;
    &lt;/tr&gt;
    &lt;tr class="table-header-row"&gt;
      &lt;th *ngFor="let col of cols" [ngSwitch]="col.field"
        [ngStyle]="{'width': col.widthPer ? col.widthPer + '%' : col.widthPx + 'px'}"&gt;
        &lt;input [(ngModel)]="designNameFilterValue" *ngSwitchCase="'designName'" pInputText class="design-name-filter"
          (keyup)="refreshTree(hideNonSelected, defaultFilter)"&gt;
        &lt;div *ngSwitchCase="'cost'"&gt;
          Value &gt;= {{cost| currency}}
          &lt;i class="fa fa-close"
            (click)="costFilterValue = 0; refreshTree(hideNonSelected, defaultFilter);"
            style="cursor:pointer" *ngIf="costFilterValue"&gt;&lt;/i&gt;
          &lt;p-slider [(ngModel)]="cost" [min]="0" [max]="maxCost"
            (onSlideEnd)="refreshTreeTable(hideNonSelected, defaultFilter)"&gt;&lt;/p-slider&gt;
        &lt;/div&gt;
        &lt;p-dropdown class="filter" *ngSwitchCase="'risk'" [options]="filterdropdown" (click)="hide()"
          [(ngModel)]="FilterValue" (onChange)="refreshTree(hideNonSelected, defaultFilter)"&gt;
        &lt;/p-dropdown&gt;
        &lt;p-dropdown class="state-filter" *ngSwitchCase="'state'" [options]="stateItemsForFilterDropDown"
          (click)="hide()" [(ngModel)]="defaultFilter"
          (onChange)="refreshTree(hideNonSelected, defaultFilter)"&gt;
        &lt;/p-dropdown&gt;
      &lt;/th&gt;
    &lt;/tr&gt;
  &lt;/ng-template&gt;
  </code></pre>
  
  <p>Please assist on this.</p>