typescript 在Angular 应用中的两个独立组件之间传递数据[已关闭]

cs7cruho  于 2023-02-10  发布在  TypeScript
关注(0)|答案(1)|浏览(105)

编辑问题以包含desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem。这将有助于其他人回答问题。
2天前关闭。
Improve this question
我需要将数据从一个组件传递到另一个依赖组件。需要将数据从A组件传递到B组件
A.component.ts
enter image description here
service. ts 'enter image description here----〉能够从A.组件和updateCondition方法的console.log中获取数据
B.component.ts
我需要service.ts中的goToHome和goToDashboard的数据
任何建议
能够在updateCondition中提取数据,但不能在方法外部访问。

vc6uscn9

vc6uscn91#

如果组件B在组件A的内部(我假设是因为,正如您所说的,两者相互依赖),您可以使用"输入和输出概念"将值直接从A传递到B。
例如,
组件A HTML:

<app-b-component [goToHome]="goToHome" [goToDashboard]="goToDashboard"></app-b-component>

组分A TS:

let goToHome: boolean = false;
let goToDashboard: boolean = true;

private goToHome(): void {
    this.goToHome = true;
    this.goToDashboard = false;
}

private goToDashboard(): void {
    this.goToHome = false;
    this.goToDashboard = true;
}

组分B TS:

@Input() goToHome!: boolean;
@Input() goToDashboard!: boolean;

在组件B TS中,使用这两个输入值和Angular 的变化检测将照顾其余的。如果我错过了什么,请让我知道。

相关问题