javascript - 值更改范围 slider HTML5 和 ng-repeat AngularJs

Question

我使用 HTML5 范围 slider 来设置值(状态)并将其发送到数据库。我现在遇到的问题是，当我重新加载页面时， slider 及其值始终设置为“50”。 slider 是在 angularjs 的 ng-repeat 内部生成的。当我更改数据库中的值时，我看到 slider 中的“值”正在更改，但 gui 没有任何反应...

有人可以帮我解决这个问题吗？提前致谢...

<h3 style="text-align: center">{{dim1}}</h3>
<input ng-model="dim1" ng-touchend="dim_switch(node, dim1)" ng-mouseup="dim_switch(node, dim1)" id="dimslider" value="{{parseInt(node.status)}}" type="range" step="1" min="0" max="100">

Answer 1

由于 ng-repeat 创建了一个新的子作用域。( doc. )。

因此您的 $soppe.dim1 被新的子作用域覆盖。因此，通过分层模型包装您的属性以利用 javascript 原型(prototype)继承，并保留您的 $scope 属性。

如 $scope.slider = {dim1 : ''} 并在 HTML 中使用它，如:{{slider.dim1}}。

进一步:parseInt()不会在 Angular 表达式中求值，请将其移动到某个 Controller 方法。

例如:ng-value="someMethod(node.status)"并从 Controller 方法返回parseInt(statusParam)