需要通过所有组件之间的Web服务传递和使用ID和参数(Angular 4)

Question

我正在一个与学校管理有关的项目中工作，现在我有2个网络服务，其中一项拥有有关学校的基本信息，第二个包含学校部门，成绩，课程和主题。

部门Web服务已连接到所选学校的ID，因此我必须将ID从学校列表组件转到部门组件和部门Web服务，然后以获取有关所选学校ID的部门数据，我尝试使用路线进行操作，但它不起作用，我仍然必须指定我需要显示其数据的ID，但是当我单击任何学校时，我需要动态工作，而无需将其设置在ng onInit中。p>您可以从下面的链接中查看项目，并告诉我要编辑什么才能传递学校ID参数并使用它在Disecorment或我想要的任何组件中获取其数据。

我仍然刚开始时，请尽可能简单和乐于助人。

这是Stackblitz上的项目链接

单击登录而无需输入用户名或密码，单击任何学校，单击部门，这是问题所在的地方，分区组件。

您可以在业务服务中找到学校服务

如果有什么不清楚的话，请问

还检查路由器模块以查看我是否正确编写。

只有76号ID的学校有数据，其余的仍然是空的。

链接到学校列表API

divisions api，但您需要发送ID参数才能获取数据(这是具有数据的76(

链接到分区API

Answer 1

我会将ID存储在服务中。然后，您也可以在其他组件中调用服务

import { Injectable } from '@angular/core';
import { HttpClient, HttpErrorResponse } from '@angular/common/http';
import { environment } from '../../environment/environment'
import { SchoolsModel } from '../models/school-model';
@Injectable()
export class SchoolsService {
constructor(public http: HttpClient) {
  }

//You can use Getter and Setter to get your selected School in other 
//components 
 protected  _selectedSchool:SchoolsModel;
  get selectedSchool(): SchoolsModel {
    return this._selectedSchool;
  }
  set selectedSchool(value: SchoolsModel) {
    this._selectedSchool = value;
  }


  public getSchoolList(): any {
    const apiUrl: string = environment.apiBaseUrl +     '/api/en/getschools/getSchools';
    // debugger;
        let promise = new Promise((resolve, reject) => {
      return this.http.get(apiUrl)
        .subscribe(respose => {
          console.log(respose.data);
      return resolve(respose.data);
    }, (err: HttpErrorResponse) => {
      return reject(err);
    });
});
return promise;
  }

  public getSchoolDetail(schoolId: number): any {
const apiUrl: string = environment.apiBaseUrl + '/api/en/getschools/getSchools';
// debugger;
let promise = new Promise((resolve, reject) => {
  return this.http.get(apiUrl)
    .subscribe(respose => {
    this._selectedSchool = respose.data.find(x => x.id == schoolId);
      // debugger;

      return resolve(this._selectedSchool);
    }, (err: HttpErrorResponse) => {
      return reject(err);
    });
});
return promise;
  }
}