AngularJS：输入值的总和
我有一个简单的输入列表，绑定到一个很好显示的项目列表。当我更改输入中的值时， 总和不会更新？
示例：http：//plnkr.co/edit/B7tEAsXSFvyLRmJ5xcnJ？p
= preview
HTML
<body ng-controller="MainCtrl">
<div ng-repeat="item in items">
<p><input type=text value="{{item}}"></p>
</div>
Total: <input type=text value="{{sum(items)}}">
</body>
脚本
app.controller('MainCtrl', function($scope) {
$scope.items = [1,2,5,7];
$scope.sum = function(list) {
var total=0;
angular.forEach(list , function(item){
total+= item;
});
return total;
}
});
问题答案：
检查此提琴是否实现：http :
//jsfiddle.net/9tsdv/
需要注意的要点：
- 将ng-model指令与输入元素一起使用，以允许项目模型与输入元素之间进行双向绑定
- 由于ng-repeat创建一个子作用域，并且items数组中的元素属于原始类型或值类型，因此它们在第一个摘要周期中按值进行复制，因此对输入字段所做的任何更改都不会反映在总和中，因为现在，修改已绑定到ng-repeat的已创建子范围中的变量。（有关更多信息，请参见有关范围继承的其他参考）
HTML：
<body ng-controller="MainCtrl">
<div ng-repeat="item in items">
<p><input type=text ng-model="item.value"></p>
</div>
Total: <input type=text value="{{sum(items)}}">
</body>
控制器代码：
app.controller('MainCtrl', function($scope) {
$scope.items = [ { value: 1 }, { value: 2 }, { value: 5}, { value: 7 } ];
$scope.sum = function(list) {
var total=0;
angular.forEach(list , function(item){
total+= parseInt(item.value);
});
return total;
}
});
-
问题内容： 我正在尝试编写一条指令，该指令会自动在中格式化数字，但模型未格式化。使它正常工作是很好的，在加载时，输入值在控制器中显示为1,000,000和1000000，但是，只有键入时，该函数才会触发。发生火灾的唯一时间是指令被加载且值为0时。 我怎样才能使它在keypress上起作用（我曾尝试绑定到keypress / keyup，但它不起作用）。 这是我的代码： 问题答案： 这是我们使用的工
-
在angularJs中，我有一个输入文本框，如何设置默认值？我尝试了但失败了。
-
问题内容： 我正在寻找将输入中的值限制为4并将4位数字值处理给我的控制器的方法。 问题答案： 可以随时为其发出指令：
-
问题内容： 我有一个AngularJS属性指令，并且只要其父输入的值发生更改，我都想采取措施。现在，我正在使用jQuery： 没有jQuery，有没有办法做到这一点？我发现keyPress事件并没有完全实现我想要的功能，虽然我确定自己会提出解决方案，但是当我在Angular项目中使用jQuery时，我会有些紧张。 那么，Angular如何做到这一点呢？ 问题答案： AngularJS文档中有一个很
-
主要内容：输入验证,应用代码,实例解析AngularJS 表单和控件可以验证输入的数据。 输入验证 在前面的几个章节中，你已经学到关于 AngularJS 表单和控件的知识。 AngularJS 表单和控件可以提供验证功能，并对用户输入的非法数据进行警告。 客户端的验证不能确保用户输入数据的安全，所以服务端的数据验证也是必须的。 应用代码 < !DOCTYPE html > < html > < script src= "http:/
-
问题内容： 在用户更改日期之前，日期输入不会显示日期 jsbin中的示例代码 我需要它才能在稳定的1.2.14版本上工作。可能吗？ 问题答案： 我创建了一个简单的指令，以使标准表单元素能够与AngularJS〜1.2.16一起正常工作。 请查看此处以获取详细信息：https : //github.com/betsol/angular-input-date 这是演示：http : //jsfiddl