title: reload particular component on event from another component in angular 6
body: <p>I have 2 components when i passing value from component 1  to component 2 using Router.Navigate method both component 1 and component 2 is getting reloaded instead of component 2 reload only</p>
  
  <p>component 1.ts</p>
  
  <pre><code>ngOnInit() {
    this.getFilter();
  }
  submit(){
    this.router.navigateByUrl('/home', { skipLocationChange: true });
    setTimeout(() =&gt; this.router.navigate(['/category']));
  } 
  getFilter() {
    this.getFiltersFromLS();
    this.dataservice.getFilter().subscribe(datas =&gt; {
    this.filters  = datas;
    });
  }
  </code></pre>
  
  <p>component 1.html</p>
  
  <pre><code>&lt;li *ngFor="let data of label"&gt;
     &lt;mat-checkbox   (change)="submit(data.val)"  value="{{data.val}}"&gt;
        &lt;span class="attributes"&gt; {{data.value}}&lt;/span&gt;
     &lt;/mat-checkbox&gt;
  &lt;/li&gt;
  </code></pre>
  
  <p>component 2.ts</p>
  
  <pre><code>ngOnInit() {
    this.getcategory();
  }
  getCategory() {
    this.getFiltersFromLS();
    this.dataservice.getCategory().subscribe(data =&gt; {
    this.category  = data;
    });
  }
  </code></pre>