通过为json对象命名,将计算的ng-model添加到json对象中

Add calculated ng-model to a json object by giving it a name

提问人:user7370387 提问时间:1/9/2017 最后编辑:Eloimsuser7370387 更新时间:1/9/2017 访问量:761

问:

我有一个奇怪的问题......

在我看来,我有这个

<td>
    <input ng-model="ca_mta_drive_min()"
           class="form-control"
           placeholder="Exemple : 2 500 000"
           ui-money-mask="0"
           disabled>
    </input>
</td>

在我的控制器中,该值的计算方式如下:

$scope.ca_mta_drive_min = function() {
    return $scope.etude.ca_pdm_d_mini
        * $scope.etude.foyer_zone
        * ((parseInt($scope.etude.ca_eomini) + parseInt($scope.etude.ca_eomaxi)) / 2)
        * $scope.etude.achat_internet
        * $scope.etude.ca_coefficient;
}

它工作得很好,但是问题是我必须用计算值更新json对象练习ca_mta_drive_min...不知道你是否明白我的意思,我需要把它发送到后端

让你明白;我需要我的观点来做这样的事情(注意它是一个值,而不是一个函数:

<td>
    <input ng-model="ca_mta_drive_min"
           class="form-control"
           placeholder="Exemple : 2 500 000"
           ui-money-mask="0"
           disabled>
    </input>
</td>

因为我的对象练习曲中有很多东西,但我不知道如何将计算值放入其中?我尝试过ng-change,但这不是真正的问题。

最后,我用 $http 将练习曲对象发送到后端,但是我如何将计算值推送到名为“练习曲”的 json 中?

我不想在使用 $http 发送之前调用每个函数,我可以想要一个链接到我的 HTML INPUT 的“附加 ng-model”,它会自动更新。

angularjs json

评论

0赞 Avnesh Shakya 1/9/2017
为什么要输入,尝试方法,如果仍然想使用,请检查以下内容:ng-model-options-getter-settermethodng-modelng-change
0赞 user7370387 1/9/2017
谢谢,我正在尝试 ng-change,但输入没有显示任何内容。
0赞 Avnesh Shakya 1/9/2017
需要使用这样的东西来放置对象:ng-modelng-model="xyz" ng-change="ca_mta_drive_min()"
0赞 user7370387 1/9/2017
问题在于,正在更改的值不是此 INPUT 的值,而是来自其他 INPUTS,因此它不执行任何操作。
1赞 user7370387 1/9/2017
非常感谢它终于起作用了,我已经将我的 ng-model 放在其他输入上,并且在每个函数中,我不再返回,但我正在设置这样的变量,例如: $scope.ca_mta_internet_change = function(){ $scope.etude.ca_mta_internet = $scope.etude.foyer_zone * $scope.etude.achat_internet * ((parseInt($scope.etude.ca_eomini) + parseInt($scope.etude.ca_eomaxi)))/2) * $scope.etude.ca_coefficient ; }

答:

0赞 jusopi 1/9/2017 #1

首先,你需要明白,如果你使用一个函数作为 ng-model,那么你需要使用 .这样 angular 就知道调用 getter/setter 函数。该函数的签名还需要遵循以下约定:ng-model-options="{ getterSetter:true }"

吸气剂/二传手

var _privateVar = ...
$scope.getterSetterFunc = function( val ){ 
    if( val ) _privateVar = val
    else return _privateVar
}

...类似的东西。“陷阱”是,如果你试图影响在你的 getter/setter 中从计算中拉取一个值,你可以触发另一个调用该函数的摘要循环,该函数计算另一个值,从而创建一个无休止的摘要循环。希望 Angular 会抱怨这一点,并通过错误将您踢出循环。

ng-model-options文档 - https://docs.angularjs.org/api/ng/directive/ngModelOptions#arguments

保持简单

最好将普通的 var 插入 ,然后用于调用控制器上的计算函数。您可能还希望在其中加入一些逻辑,以防止在模型未更改的情况下进行计算。我不确定 angular 通过什么样的安全提供了什么样的安全保障,但我猜如果你有模型值的变化,然后在摘要周期内翻回它的原始值,它仍然会启动一个变化。ng-modelng-changeng-change

评论

0赞 user7370387 1/9/2017
非常感谢,我会努力的。但问题是我需要同时在其他几个 HTML 输入上编写 ng-change 才能启动计算函数,并且有很多基于这些其他输入的计算函数。
0赞 user7370387 1/9/2017
好的,所以我现在正在使用 ng-change,但我必须开始 25 个不同的函数!你觉得是不是太过分了?在视图中看起来不会很好!
0赞 jusopi 1/9/2017
没有看到完整的控制器代码和所有 25 个计算,我不能说。从那以后,我已经不再使用控制器进行大量计算,而是使用过滤器。我的应用程序里有几十个过滤器。这仅取决于您的需求。如果是基于输入的只读类型计算,则筛选器可能会更好。如果计算是异步的或需要不太直接的方法,则坚持使用控制器函数。