angular + pagination + page resets to 1 on navigation to secondary outlet

Question

I have implemented a custom pagination component using PaginationControlsDirective.

I have a requirement where in I have to open a dialog component (pop up) as a secondary outlet from the pagination component. Scenario is:

Have a parent component.

Pagination component is the primary outlet.

Dialog/popup is the secondary outlet.

URL to pagination component: http://localhost:4200/pricing/quickViewPricing/pricesite?page=2

Now on a button click, I call router.navigate to secondary outlet:

this.router.navigate([{ 
   outlets: { fullViewPopup: ‘fullviewprice’ } }], 
   { relativeTo: this.route.parent });

Pop up opens with the URL:

http://localhost:4200/pricing/quickViewPricing/(pricesite//fullViewPopup:fullviewprice/fullviewpricedetail)

pricesite is my primary outlet at quickViewPricing fullViewPopup is my secondary outlet on quickViewPricing

ISSUE: When the pop up comes up, the page number is not retained and the page goes back to first page.

routing.module:

path: 'quickViewPricing',
    component: QuickViewPricingComponent,
    data: { breadcrumb: "Pricing - Qucik View Price" },
    children: [
      {
        path: 'pricesite',
        component: QvpPaginationContainerComponent,
        outlet: 'primary',
        canActivate: [DoNotShowSecondaryOnRefreshGuard]
      },
      {
        path: 'fullviewprice',
        component: FullViewPriceComponent,
        outlet: 'fullViewPopup',
        children: [
          {
            path: 'fullviewpricedetail',
            component: FullViewPriceDetailComponent
          }
        ]
      }  
    ]

QvpPaginationContainerComponent //Event handler on button click

public fullViewClick(event) {
this.router.navigate([{ outlets: { fullViewPopup: 'fullviewprice' } }], { relativeTo: this.activatedRoute.parent });
event.stopImmediatePropagation();
}

QvpPaginationContainerComponent.html

<div class="col-md-12" *ngFor="let item of collection | paginate: config; let i = index">
    <app-price-site [index]="i" [siteId]="item"></app-price-site>
  </div>

selector app-price-site is a custom pagination component

1. QvpPaginationContainerComponent is the primary outlet with pagination implemented
2. FullViewPriceComponent is the secondary outlet and is a dialog which is working fine.

When I navigate to page 2 in QvpPaginationContainerComponent and click the button, the pop up comes up but the page gets reset to first page in QvpPaginationContainerComponent.

Any help for this is much appreciated.