如何将PatientDetailsComponent的id赋值给Labtest类的patientId？

根据你的需求，要把PatientDetailsComponent中获取的路由id赋值给Labtest类的patientId属性，分以下几种常见场景处理：

场景1：Labtest类在非父子关系的其他组件中实例化 #

这种情况优先用共享服务实现跨组件数据传递：

步骤1：创建共享数据服务 #

import { Injectable } from '@angular/core';
import { BehaviorSubject } from 'rxjs';

@Injectable({
  providedIn: 'root'
})
export class PatientDataService {
  private patientIdSource = new BehaviorSubject<string | null>(null);
  currentPatientId = this.patientIdSource.asObservable();

  setPatientId(id: string | null) {
    this.patientIdSource.next(id);
  }
}

步骤2：在PatientDetailsComponent中传递id到服务 #

import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { PatientDataService } from './patient-data.service';

export class PatientDetailsComponent implements OnInit {

  constructor(
    private _route: ActivatedRoute,
    private patientDataService: PatientDataService
  ) {}

  ngOnInit(): void {
    const id = this._route.snapshot.paramMap.get('id');
    console.log(id);
    // 将获取到的id传入共享服务
    this.patientDataService.setPatientId(id);
  }
}

步骤3：在使用Labtest的组件中接收并赋值 #

假设你在LabtestComponent中使用Labtest类：

import { Component, OnInit } from '@angular/core';
import { PatientDataService } from './patient-data.service';
import { Labtest } from './labtest';

export class LabtestComponent implements OnInit {
  labtest = new Labtest();

  constructor(private patientDataService: PatientDataService) {}

  ngOnInit(): void {
    // 订阅服务中的id，赋值给labtest的patientId
    this.patientDataService.currentPatientId.subscribe(id => {
      if (id) {
        this.labtest.patientId = id;
      }
    });
  }
}

场景2：使用Labtest的组件是PatientDetailsComponent的子组件 #

父子组件场景下，用**@Input()装饰器**直接传值更高效：

步骤1：在子组件中定义输入属性 #

假设子组件为LabtestComponent：

import { Component, Input, OnInit } from '@angular/core';
import { Labtest } from './labtest';

@Component({
  selector: 'app-labtest',
  templateUrl: './labtest.component.html'
})
export class LabtestComponent implements OnInit {
  labtest = new Labtest();
  @Input() patientId!: string;

  ngOnInit(): void {
    this.labtest.patientId = this.patientId;
  }
}

步骤2：在父组件模板中传递id #

修改PatientDetailsComponent的模板，给子组件传值：

<!-- PatientDetailsComponent的模板文件 -->
<app-labtest [patientId]="id"></app-labtest>

同时在PatientDetailsComponent类中把id声明为类属性：

export class PatientDetailsComponent implements OnInit {
  id!: string | null;

  constructor(private _route: ActivatedRoute) {}

  ngOnInit(): void {
    this.id = this._route.snapshot.paramMap.get('id');
    console.log(this.id);
  }
}

场景3：直接在PatientDetailsComponent内部使用Labtest #

如果是在当前组件内实例化Labtest，直接赋值即可：

import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { Labtest } from './labtest';

export class PatientDetailsComponent implements OnInit {
  labtest = new Labtest();

  constructor(private _route: ActivatedRoute) {}

  ngOnInit(): void {
    const id = this._route.snapshot.paramMap.get('id');
    console.log(id);
    if (id) {
      this.labtest.patientId = id;
    }
  }
}

内容的提问来源于stack exchange，提问作者54V4G3208