为什么我的javascript obj没有在angularjs中更新

Question

我使用angularJS，并有以下控制器变量：

cont.flag = 0;
cont.obj = {objFlag: cont.flag, objFunction: cont.func};
cont.func = function() {
// do stuff
}

cont.flag变量绑定到HTML中的用户输入。因此，当该值发生变化时，我希望objFlag进行更新，而它目前没有进行更新。此外，objFunction值似乎总是未定义的。这是因为cont.obj是在cont.func之上声明的吗？

编辑：如果不清楚的话，cont.flag变量是通过用户输入正确更新的，它只是我的obj中指向cont.flag的指针，没有更新。此外，objFunction没有被我传递的函数填充。

以下是我在评论中提供的更多信息，说明为什么我在对象中有这些变量，而不是直接操作它们：所以我有一系列函数，我想把它们链接在一起，但我想控制运行哪些函数。因此，我为每个函数都有一个obj：objFlag，它表示是否应该将函数添加到链中，objFunction是要运行的实际函数。我想要一种将objFlag与附带的objFunction关联起来的方法

Answer 1

objFlag不随cont.flag一起更改的原因与Angular无关。这是本机Javascript行为。

此声明：

cont.obj = {objFlag: cont.flag, objFunction: cont.func};

仅将初始cont.flag值分配给objFlag，并且objFlag和cont.flag之间没有正在进行的链接

已经对此进行了解释

• Javascript-如何在不重新分配对象属性的情况下更改对象属性
• 对象属性随指定变量的值而动态更改

Answer 2

让我们以其他方式思考您的代码

cont.flag = 0;
cont.obj = {objFlag: cont.flag, objFunction: cont.func};
cont.func = function() {}

相当于

var cont = {
flag: 0,
obj: {objFlag: cont.flag, objFunction: cont.func},
func: function() {}
}
console.log(cont.obj);

您可以在此处看到未定义的cont(无法读取未定义的属性"flag"(。我们无法将变量访问到同一对象中的另一个变量中。

所以，你会想在这里使用this

var cont = {
flag: 0,
obj: {objFlag: this.flag, objFunction: this.func},
func: function() {}
}
console.log(cont.obj);

同样，你会得到未定义的值，因为我们不能用另一个变量访问对象元素。但我们可以使用函数来访问它们。所以最后一种选择是使用obj的getter函数将json和其他变量的数据返回到一个变量中。(在自引用json对象中(

var cont = {
flag: 0,
get obj() {return {objFlag: cont.flag, objFunction: cont.func}},
/*or*/
/* get obj() {return {objFlag: this.flag, objFunction: this.func}},*/
func: function() {}
}
console.log("Before change", cont.obj);
//change
cont.flag = 10;
console.log("After change", cont.obj);

更新

现在，结合您的案例和上面的解释，其中cont是控制器的参考，您可以如何在角度控制器中添加getter属性。

Object.defineProperty方法正是您所需要的。所以你的最终代码是：

cont.flag = 0;
Object.defineProperty(cont, 'obj', {
get: function() {
return {objFlag: cont.flag, objFunction: cont.func}
}
});
cont.func = function() {}
// you can access obj property to see the values
console.log(cont.obj)