Angular - ActivatedRoute in click event

Question

I am using ActivatedRoute to call the summary table from one component to another component and I added below I am not able to get the summary table as expected in click event

tab-routing.module.ts

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { TABMasterComponent } from '../tabs/tab-master/tab-master.component';


const routes: Routes = [
  { path: "tabmasters", component: TABMasterComponent,
        loadChildren:'../tabs/tab-master/tab-master.component',
     data:{
       istab : false
     }
     },
];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule { } 

tabmasters.component.ts

istab = false;


constructor(private fb: FormBuilder,private router: Router, private toastr:ToastrService, private route:ActivatedRoute) {
      this.istab = this.route.snapshot.data.istab;
      console.log('here',this.route.snapshot.data)
      }

tabmaster.component.html

<div *ngIf="iscontrol">
        <div class="table-responsive">
            <table class="table">
                <thead class="table_header">
                    <tr>
                        <th>Name</th>
                    </tr>
                </thead>
                <tbody>
                    <tr *ngFor="let cl of ClList;">
                        <td>{{ cl.name}}</td>
                    </tr>
                </tbody>
            </table>
         </div>
</div>
<div *ngIf="istab">
        <div class="table-responsive">
            <table class="table">
                <thead class="table_header">
                    <tr>
                        <th>Name</th>
                    </tr>
                </thead>
                <tbody>
                    <tr *ngFor="let tab of tabList;">
                        <td>{{ tab.name}}</td>
                    </tr>
                </tbody>
            </table>
         </div>
</div>

I want to show istab summary when I use the click event in app component. but I am facing the problem is these two above table is in tab component and I want to show istab summary only in click event

TAB1----isctrl summary              TAB2-----istab summary                   

I used the boolean if I click tab 1 isctrl true and istab false and if I click tab2 ista is true and isctrl is false

the above two summary is in tabcomponent which is used to show is bootstrap nav tabs like below tabs

my app.component.HTML is like

<button (click)="gotoTabsUMMARY()"></button>

and my app.component.TS is like

istab = false;


constructor(private fb: FormBuilder,private router: Router, private toastr:ToastrService, private route:ActivatedRoute) {
      this.istab = this.route.snapshot.data.istab;
      console.log('here',this.route.snapshot.data)
      }



gotoTabsUMMARY(){
        this.router.navigate(["/tabsmasters"], { skipLocationChange: true, this.istab})
}

I want to go to the summary table in click event in app component. normal router link is working but I want to get summary which is in tab2 I used the another method emit is not working How to use activatedRoute to this..