$ scope.myObjectVariable值设置为input属性值

晚上好,

我正在写一个使用AngularJS的应用程序,我需要应用程序通过POST请求向nodejs服务器发送数据。

我的数据结构像一个JSON对象,它具有数据绑定感谢AngularJS框架。

到目前为止,一个函数正在dynamic地尝试创build用户可能喜欢的某些input标签内的可能值。 一个例子:

 <button ng-click="generateFoodAndBeverages(row)>Generate</button> <input type="text" ng-model="row.service.day.beverage" placeholder="beverage" /> <input type="text" ng-model="row.service.day.food" placeholder="food" /> 

这两个input值可以由用户通过键入他们想要的值来设置( 例如“可乐”,“汉堡” ),但是在input标签上方是可以为用户生成input值的button。

生成这些值的函数从一个数组中获取它们,然后在该函数的结尾返回两个可能的值,一个用于饮料,一个用于食物。

当它有两个返回值时,它改变两个input的属性值,将它们设置为函数产生的两种可能性:

 jQuery("#input1").attr("value", generateFoodAndBeverages(row)[0]); jQuery("#input2").attr("value", generateFoodAndBeverages(row)[1]); 

这不是完美也不高雅,但它的工作。 每次用户请求自动生成食品和饮料时,该函数都会填充并dynamic更改这两个input元素的值属性,以便实际设置值并确实存在。

即使如此,即使我在屏幕上将它们看作是input字段中的文本,我的POST请求也不能识别ng-model实际改变的事实。 ng-model将更改注册到input字段的value属性的唯一方法是如果用户使用键盘input内容,则手动更改value属性。 另一个例子:

 <input type="text" value="generateValue()" ng-model="row.service.info" /> 

这里的一个不会改变ng模型的值。

 <input type="text" value="User Typed Value" ng-model="row.service.info" /> 

这另外一个改变了ng-model的值,当它改变和存在时,它被传递给$ scope,稍后可以作为POST请求发送到服务器。

关于为什么input字段的“自动和dynamic生成”值为什么没有被ng-model注册,而用户types的值呢?

提前致谢!

[编辑]

显然这个问题伴随着ng-model不变。 我试图通过在input中应用ng-change来debugging问题。 如果更改是通过javascript完成的,它没有注册到ng-model ,并且ng-change函数不会被触发,因为ng-model没有被改变,即使我可以清楚地看到由javascript设置的新值标签。 如果我手动ng-changeinput标签的值,则会触发ng-change并且控制台logging更改。

如果每行都没有那么不同,我可以直接将这些更改应用到ng-model

像这样的ng模型:

 <input ng-model="row.serviceInfo.DayObject[dayString].food" /> <input ng-model="row.serviceInfo.DayObject[dayString].beverage" /> 

给定模型的dynamic性,我将如何能够将这些变化直接应用到ng模型中。 作为一个例子,我可以有1000行,每个都有自己的serviceInfo对象。 我不知道如何使用dynamic生成的值为每个行更改模型。

[编辑]

这个问题确实在ng模型中没有改变。 该解决scheme包括将更改应用于dynamic生成的值函数内的每个元素的ng模型。 感谢大家的意见。 如果有人遇到同样的问题,我会在这里留下这段代码! 再次感谢!

  let foodEl = angular.element(the row element food input); let beverageEl = angular.element(the row element beverage input); $scope.displayedCollection[i].serviceInfo = { "day" : { "food" : generatedValuesFood(el, day), "beverage" : generatedValuesBeverage(el, day) } }; foodEl.val($scope.displayedCollection[i].serviceInfo.day.food); beverageEl.val($scope.displayedCollection[i].serviceInfo.day.beverage); 

我认为你的问题很简单。 正如@ssougnez所说,不要混合使用jQuery与angularjs。 Angularjs使用数据绑定的概念,不要使用jquery风格来改变input值,而是使用ng-model指令将数据从模型绑定到HTML控件(input,select,textarea)上的视图。 在你的generateFoodAndBeverages函数中,只需根据哪一行设置ng-model值,如:

 var generateFoodAndBeverages = function () { $scope.row.service.day.beverage = array[0]; $scope.row.service.day.food = array[1]; };