Как сбросить/обновить данные тела вкладки в Angular Material, если пользователь переходит с одной вкладки на другую?

Если вы не хотите использовать параметры @Input, вы также можете использовать @ViewChild, чтобы получить ссылку на ваши дочерние компоненты, а затем вызвать метод этих компонентов для обновления данных.

component.ts

  import {ViewChild} from '@angular/core';
  import { MatTabChangeEvent } from '@angular/material';
  //...
  @ViewChild(PollComponent) private pollComponent: PollComponent;
  @ViewChild(SurveyComponent) private surveyComponent: SurveyComponent;


  //...
  onTabChanged(event: MatTabChangeEvent) 
  {
    if(event.index == 0)
    {
        this.pollComponent.refresh();//Or whatever name the method is called
    }
    else
    {
        this.surveyComponent.refresh(); //Or whatever name the method is called
    }
  }

component.html

<mat-tab-group id="report" (selectedTabChange)="onTabChanged($event)">

</mat-tab>

В угловом материале 8 есть возможность ленивой загрузки компонента во вкладках, когда пользователь выбирает его.

вы можете просто обернуть свой компонент для ленивой загрузки в ng-template, как показано в ссылке ниже

https://material.angular.io/components/tabs/overview#lazy-loading

Вы можете прочитать о типах взаимодействия компонентов здесь.

Вам нужно что-то вроде этого:

1. Дети -> родитель

В обоих компонентах нужен излучатель.

ГлавныйКонтроллер:

  <app-poll (changed)=this.update($event)></app-poll>

  <app-survey (changed)=this.update($event)></app-survey>

В компонентах определите эмиттер событий:

@Output() changeEmitter = new EventEmitter<any>();

когда вы хотите вызвать сброс, напишите что-то вроде этого:

changedEmitter.emit(<<you can insert objects here>>);

Это вызовет вызов в родительском методе this.update().

в этом методе вы можете определить другую логику для запуска сброса, но от родителя-потомка проще всего привязать объект данных, который вы можете изменить:

2. Родитель-> дети

  <app-survey (changed)=this.update(newValue) [data]="surveyData"></app-survey>

в основных компах:

private surveyData: any;

update(newValue: any){
  surveyData =  <<something>>
}

в опросе комп:

@Input() private data: any;