Javascript 如何在angularjs中实现基于其他对象的对象更新？_Javascript_Angularjs_Scope

Javascript 如何在angularjs中实现基于其他对象的对象更新？

javascript angularjs

Javascript 如何在angularjs中实现基于其他对象的对象更新？,javascript,angularjs,scope,Javascript,Angularjs,Scope,我正在尝试使用add方法更新变量b和c的值（简单地增加它们的值），但a（两者之和）没有反映此操作我知道我们可以使用$scope.$watch函数来更新它们，但我有一个应用程序，其中有许多对象依赖于其他对象。如果我的从属对象发生更改，我希望我的对象也发生更改，而不使用任何$watchers 这只是一个简单的例子，我试图在观察者的帮助下更新$scope.a和$scope.obj.a值。我该怎么做 <html ng-app="app"> <head> <ti

我正在尝试使用add方法更新变量

和

的值（简单地增加它们的值），但

（两者之和）没有反映此操作

我知道我们可以使用

$scope.$watch

函数来更新它们，但我有一个应用程序，其中有许多对象依赖于其他对象。如果我的从属对象发生更改，我希望我的对象也发生更改，而不使用任何$watchers

这只是一个简单的例子，我试图在观察者的帮助下更新

$scope.a

和

$scope.obj.a

值。我该怎么做

<html ng-app="app">
  <head>
    <title></title>
  </head>
  <body ng-controller="ctrl">
    a : {{a}}<br />
    b: {{b}}<br />
    c: {{c}}<br />
    <button ng-click="add();">Add</button>
    <br /><br /><br />

    obj.a : {{obj.a}}<br />
    obj.b: {{obj.b}}<br />
    obj.c: {{obj.c}}<br />
    <button ng-click="obj.add();">obj.Add</button>

    <script type="text/javascript" src="angular.min.js"></script>
    <script>
        var app = angular.module('app', []);
        app.controller('ctrl', function ($scope) {
            $scope.b = 1;
            $scope.c = 2;
            $scope.a = $scope.b + $scope.c;


            $scope.$watch('b', function (newValue, oldValue) {
                $scope.a = $scope.b + $scope.c;
            });
            $scope.add = function () {
                $scope.b++;
                $scope.c++;
            };

            //this is object with dot property example
            $scope.obj = {};
            $scope.obj.b = 1;
            $scope.obj.c = 2;

            $scope.obj.a = $scope.obj.b + $scope.obj.c;


            $scope.$watch('obj.b', function (newValue, oldValue) {
                $scope.obj.a = $scope.obj.b + $scope.obj.c;
            });
            $scope.obj.add = function () {
                $scope.obj.b++;
                $scope.obj.c++;
            };
        });
    </script>
  </body>
</html>


a:{{a}}

b:{{b}}

c:{{c}}

添加




对象a:{{obj.a}}

obj.b:{{obj.b}}

obj.c:{{obj.c}}

对象添加
var-app=angular.module（'app'，[]）；
应用程序控制器（'ctrl'，函数（$scope）{
$scope.b=1；
$scope.c=2；
$scope.a=$scope.b+$scope.c；
$scope.$watch（'b'，函数（newValue，oldValue）{
$scope.a=$scope.b+$scope.c；
});
$scope.add=函数（）{
$scope.b++；
$范围。C++；
};
//这是具有点属性的对象示例
$scope.obj={}；
$scope.obj.b=1；
$scope.obj.c=2；
$scope.obj.a=$scope.obj.b+$scope.obj.c；
$scope.$watch（'obj.b'，函数（newValue，oldValue）{
$scope.obj.a=$scope.obj.b+$scope.obj.c；
});
$scope.obj.add=函数（）{
$scope.obj.b++；
$范围.Obj.C++；
};
});

您可以通过将a（或分别为obj.a）声明为函数而不是对象/对象属性来实现这一点。每当函数使用的任何属性发生变化时，Angular将自动重新执行该函数，因此，您的“a”值将发生变化，而无需您明确定义手表

请参见下面更新的代码：

var-app=angular.module（'app'，[]）；
应用程序控制器（'ctrl'，函数（$scope）{
$scope.b=1；
$scope.c=2；
$scope.a=function（）{return$scope.b+$scope.c}；
$scope.add=函数（）{
$scope.b++；
$范围。C++；
};
//这是具有点属性的对象示例
$scope.obj={}；
$scope.obj.b=1；
$scope.obj.c=2；
$scope.obj.a=函数（）{
返回$scope.obj.b+$scope.obj.c；
}
$scope.obj.add=函数（）{
$scope.obj.b++；
$范围.Obj.C++；
};
});

a:{{a（）}}

b:{{b}}

c:{{c}}

添加




obj.a:{{obj.a（）}}

obj.b:{{obj.b}}

obj.c:{{obj.c}}

对象添加
这很好，这是一个很好的解决方案，但是否存在只对对象执行的方法？（只是好奇）不是真的。当你将a声明为一个属性（a=b+c）时，你是在告诉Angular，a仅在声明时等于b+c，而不是说它应该总是等于b+c。因此Angular不知道应该为您更新它。这就是为什么你需要一个函数，这实际上意味着a在任何时候都应该等于b+c。