代码之家 › 专栏 › 技术社区 › chuckd

如何使用角度中的一个属性指定其他属性

typescript angular javascript

chuckd · 技术社区 · 6 年前

我有一个角度服务,其中有如下变量:

export class MyService {

  someVariableA = 1;

  someParams = {
    someVariableB,
    otherVariable: this.someVariableA
  };
}

在一个组件中,我将“someVariableA”设置为3

这我的服务。某些变量a=3;

我想让“otherVariable”也得到这个值3,但它没有。当我得到这个值时,它仍然是1。

让v=这个。我的服务。一些参数。其他变量;

是否可以通过“someVariableA”以这种方式或任何其他方式设置“otherVariable”?

1 回复 | 直到 6 年前

devBrandon 6 年前

正如@Zulwarnain所回答的,1是数字或原始数据类型。javascript中的基本数据类型是通过值传递的,而不是通过引用传递的,这似乎是您在这里所期望的。

解决这个问题的一个简单方法是将一个函数分配给其他变量。现在只需调用函数someParams。otherVariable(),它将返回someVariableA的值。没必要让事情复杂化。

export class SingletonService {
  public someVariableA = 1;

  public someParams = {
    otherVariable: () => this.someVariableA
  };
}

这是一个基本的javascript,有多个源代码涵盖了这个主题。

https://codeburst.io/explaining-value-vs-reference-in-javascript-647a975e12a0

jcalz 6 年前

我同意 this answer 如果使用对象/数组之类的引用类型,而不是数字之类的基元值类型,您将有更好的时间。通过添加一层间接寻址(例如。, someVar = 123 变成 someVar = {value: 123} )你可以很容易地获得与你所寻求的类似的功能。

然而,如果您的用例要求如果要使对象的属性直接充当对存储在其他地方的基元值类型的引用,可以通过将该属性实现为 getter and setter pair .这更复杂,但它会按照你想要的方式运作。

下面是一个例子:

class MyService {
    someVariableA = 1;
    someParams: {
        someVariableB: number;
        otherVariable: number;
    };
    constructor() {
        this.someVariableA = 1;
        const that = this;
        this.someParams = {
            someVariableB: 2,
            get otherVariable() {
                return that.someVariableA
            },
            set otherVariable(val: number) {
                that.someVariableA = val;
            }
        }
    }
}

请注意,为了 otherVariable getter和setter为了能够访问正确的上下文,我必须将代码移动到构造函数中并进行复制 this 我调用了一个新变量 that 这个 这 getter/setter的上下文指的是它所属的对象,而不是某些对象 这 从外部范围来看。

让我们确保它能工作:

const ms = new MyService();
ms.someVariableA = 100;
console.log(ms.someParams.otherVariable); // 100
ms.someParams.otherVariable = -5;
console.log(ms.someVariableA); // -5

看起来不错;改变 ms.someVariableA 立即反映在 ms.someParams.otherVariable ,反之亦然。好吧,希望有帮助;祝你好运

Playground link to code

Zulqarnain Jalil 6 年前

您正在分配 值类型 这不是你想要的。你需要分配 参考类型

obj ={someVariableA : 1};

  someParams = {
    otherVariable: this.obj
  };

在上面的代码中,如果更改obj的值。someVariableA还将更改someParams的值。其他变量

我希望你们对引用类型和值类型变量有一定的了解

click here for demo

-1

Rick 6 年前

我觉得你不想这么做。我相信你每次调用它都会得到一个新的服务实例,所以变量会被重置。

您可能希望在localStorage中设置该变量,然后让服务从localStorage中检索该变量。这样,它将永远得到它上一次设定的目标。

或者只是将该变量传递到服务调用中,而不是尝试使用本地服务变量。