角度如何修改其他组件方法中的组件字段

Question

>我正在尝试修改其他组件中组件的字段，但值没有更改。示例我在组件 1 中使用字段 A 创建了组件 2 我使用参数 A 创建了方法计算我正在对参数 A 进行一些计算，但在组件 1 中，方法计算变量 A 后没有更改。

export class Component1 {
A : number = 0;

calculateA() {
Component2.calculateA(this.A);
// variable A is not changed
}
}
export class Component2 {
static calculateA(A : number) {
A = 5;
}
}

为什么 A 值不更改？

Answer 1

数字参数是 JavaScript 中的值对象，这意味着值被传入，更改函数中的参数不会影响用于参数的源变量。

let x = 5;
function func(val) {
val = 10;
}
func(x);
console.log(x);

如果按对象传入参数，则函数可以更改参数的值，但这是不好的编程实践。

let x = { prop: 5 };
function func(val) {
val.prop = 10;
}
func(x);
console.log(x);

阅读值与参考对象。

话虽如此，你显然对Angular很陌生，你还没有准备好学习Angular，你需要先学习RxJs。一旦你理解了RxJs，就回到学习Angular。如果你不知道什么是可观察的、主题的或行为的主题，那么你应该学习响应式编程而不是 Angular。

Answer 2

请记住，这不是角度组件通信的正确方式。 我建议你应该使用服务。 您可以在此处阅读有关它的更多信息。

在您的问题中，您应该从组件 2 返回A的值。

static calculateA(A : number) {
A = 5;
return A;
}

现在，要在组件 1 中将此值分配给 A，请执行以下操作。

export class Component1{
A : number = 0;
calculateA() {
this.A = Component2.calculateA(this.A);
// variable A is not changed
}
}

您的代码不起作用，因为您传递的是value而不是reference。 如果您使用原始数据类型，那么它将通过值传递，否则引用将被传递。