ng在更新$scope后重复不更新信息

ng-repeat not updating information after $scope was updated

本文关键字：更新 信息 scope ng      更新时间：2023-09-26

我有一个ng-repeat，它创建了一个带有一些起始数据的表单。然后，用户可以自由修改所述数据，并且更改应显示在表单中。在此之前，用户提交的数据由另一个函数进行净化，该函数由按钮上的ng-click调用。

引擎盖下一切都很好（我检查了我的$scope.some_array，ng-repeat从中获取数据，新数据在正确的位置），但页面上什么都没有发生。

要素：

<li ng-repeat="field in some_array" id="field-{{$index}}">
            <div class="{{field.field_color}}">
                <button type="button" ng-click="save_field($index)">done</button>
                {{field.nice_name}}
            </div>
            <div id="field-input-{{$index}}">
                <input type="text" id="{{field.tag}}" value="{{field.content}}">
                <label  for="{{field.tag}}">{{field.nice_name}}</label>
            </div>
  </li>

save_field代码：

$scope.save_field = function (index) {
        console.log($scope.some_array[index]["content"])
        var value = $("#field-" + index).children("div").children("input").val()
        var name = $scope.some_array[index]["name"]
        var clean_value = my_clean(value)
        if (norm_value === "") {
            return
        }
        $scope.some_array[index]["content"] = clean_value
        console.log($scope.some_array[index]["content"])
    }

在控制台上我看到：

10.03.16
10/03/16

这是对的，但在表格中我只看到10.03.16。我已经尝试将$timeout(function(){$scope.$apply()})作为函数的最后一行，但输出仍然相同。

如果你想将变量绑定到输入，就不应该使用这样的输入。摘要循环会刷新值，但不会明显更新，因为这不是html本机行为。

使用ng模型，它将按预期更新输入的视图值：

<input type="text" id="{{field.tag}}" ng-model="field.content">

同样使用ng模型，当用户修改输入时，您的变量将被更新，因此您可以在save_field函数中检索它来更容易地进行一些处理，而无需jQuery:

$scope.save_field = function (index) {
    if (norm_value === "") {
      return;
    }
    $scope.some_array[index]["content"] = my_clean($scope.some_array[index]["content"]);
};

更多信息：https://docs.angularjs.org/api/ng/directive/ngModel

相关文章：