角度5-组件和服务之间的通信

我使用角度5。 目的是在登录正常时加载数据,并在其他组件中使用这些数据。 通过使用带有getActiveTasks方法和getStats方法的服务类加载数据。 登录组件:

@Component({
  selector: 'app-login',
  templateUrl: './login.component.html',
  styleUrls: ['./login.component.css']
})
export class LoginComponent {

  constructor(private auth: AuthenticationService,
              private klinckServices: KlinckServices,
              private router: Router) { }

  loadData($event) {
    console.log('Authentification OK');
    let success;
    this.klinckServices.getActiveTasks(this.auth.getEcmUsername())
      .then((webScriptdata) => {
          console.log('KlinckSercices - loadData');
          success = webScriptdata;
          this.klinckServices.listTasks = success.data as ActiveTask[];
          this.router.navigate([this.klinckServices.getStats()]);
          console.log(this.klinckServices.listServices);
        },
        msg => {
          alert(msg);
          return '';
        });
   // this.router.navigate([this.klinckServices.loadData()]);
  }
}

服务类别:

@Injectable()
export class KlinckServices {

  listTasks: ActiveTask[];
  listServices: Stats [] = [];

  constructor(private apiService: AlfrescoApiService,
              private auth: AuthenticationService) {
    console.log('KlinckServices - constructor');
  }
  getStats(): string {
    this.listTasks.forEach((item, index) => {
      if (this.getServicesInListTasks(item.properties.wfvd_nomService) !== null) {
        if (! this.getServicesInListServices(item.properties.wfvd_nomService)) {
          const listLength = this.listTasks.filter(item2 => item2.properties.wfvd_nomService === item.properties.wfvd_nomService).length;
          console.log(listLength);
          const at: ActiveTask[] = [];
          for (let i = 0; i < listLength; i++) {
            at.push(this.listTasks.filter(item2 => item2.properties.wfvd_nomService === item.properties.wfvd_nomService)[i]);
          }
          this.listServices.push({
            data: at,
            count: listLength,
            service: item.properties.wfvd_nomService
          });
        }
      }
    });
    return '/dashboard';
  }
  getServicesInListServices( serviceSearch: string) {
    return(this.listServices.find( x => x.service === serviceSearch));
  }
  getServicesInListTasks( serviceSearch: string) {
    return(this.listTasks.find( x => x.properties.wfvd_nomService === serviceSearch));
  }

加载仪表板组件时,我需要检索以下数据:

@Component({
  selector: 'app-dashboard',
  templateUrl: './dashboard.component.html',
  styleUrls: ['./dashboard.component.css']
})
export class DashboardComponent implements OnInit, AfterViewInit 
{
  @ViewChild(DataTableDirective) datatableElement: DataTableDirective;
  @Input() public klinckServices: KlinckServices;

  listTasks: ActiveTask[];
  listPatients: Patient[];
  listMedecins: Medecin[];
  listDocType: Typologie[];
  listServices: Stats [] = [];
  dtOptions: any = {};
  docNodeId: string;
  detailTaskId: any;

  constructor(private auth: AuthenticationService,
              public dialog: MatDialog,
              private http: HttpClient) 
  {
    console.log('DashboardComponent - constructor');
    this.listServices = this.klinckServices.listServices;
    console.log(this.listServices);
    this.getPatients();
    this.getMedecins();
    this.getDocumentType();
  }

但我在控制台中收到此错误消息:“error TypeError:无法读取未定义的属性‘listServices’”

那么,组件和服务之间通信的最佳方式是什么呢?