javascript - 包含许多控件的表单以及它们之间的交互。比 $scope.$watch 更简洁的方法?

标签 javascript angularjs

我正在构建一个 Angular 应用程序,该表单有大约 15 个控件。这是一个财务应用程序。请不要建议破坏页面等。

一些控件相互依赖。大约有 5 个输入控件(我们称之为源控件),其中任何一个都可以更改,并影响 5 个其他控件(我们称之为目标控件)中的一个或多个。我的结构方式是,我在 5 个源变量中的每一个上都有一个 $scope.$watch,并且在每个监视函数中,我都有一些代码来决定要更新 5 个目标变量中的哪一个,然后更新它们。其中一款 watch 的示例如下所示。

$scope.$watch('money.price',function(newVal,oldVal) {

    if(newVal != oldVal) {

        if($scope.money.quantity != undefined) {
            updatePrincipal($scope)
            updateFees($scope);
            $scope.money.net = $scope.money.principal + $scope.money.fee 
        }
    }
});

我真的不觉得这很优雅。有没有更好/更干净的方法来做到这一点? (该表单将来只会变得更复杂一点,即多 2-3 个依赖字段,但不会更多)。

最佳答案

假设您的输入控件附加了 ng-model,我建议将 ng-change 添加到每个输入表单,您可以使用相同的函数一次更新所有范围绑定(bind)

关于javascript - 包含许多控件的表单以及它们之间的交互。比 $scope.$watch 更简洁的方法?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35261299/

相关文章:

javascript - ng-grid是否支持按行进行单元格过滤( Angular 过滤)

javascript - 带有端点的 Angular 服务

css - 如何根据过渡的长度在 CSS 中显示和隐藏文本

javascript - 运行 Node Express 服务器显示错误消息

Javascript 函数只调用一次

javascript - 异步过滤 Promise 数组

html - Bootstrap 网格系统 : pull last column right regardless of other columns?

javascript - Famous 中的发出/订阅模式与管道模式

javascript - Angular 4 : Call angular function from a global listner

javascript - 为什么 min 属性会导致 ngChange 被调用?