Angular ng在资源上重复.焦点失去了对资源更新的关注

Question

我有一个页面在资源中的对象集合上使用ngRepeat。当对象上的任何字段发生更改时，资源将发布到服务器，并且服务器将再次返回对象集合并在模型上更新。这会导致 ngRepeat 重新渲染并在当前编辑字段上丢失焦点。有没有办法在资源中检查发送到服务器的数据和返回的数据之间是否有任何更改，并且仅在模型不同时才更新模型？

Answer 1

使用"track by"。 如果资源项具有特定 ID，则为

ng-repeat="item in resource.items track by item.id"

这将防止 angular 重新渲染它已经渲染的项目，并且应该保留 DOM 的状态。

Answer 2

add attribute set-focus-if="

directive('setFocusIf', function ($timeout) {
    return {
        link: function ($scope, $element, $attr) {
            $scope.$watch($attr.setFocusIf, function (value) {
                if (value) {
                    $timeout(function () {
                        // We must reevaluate the value in case it was changed by a subsequent
                        // watch handler in the digest.
                        if ($scope.$eval($attr.setFocusIf)) {
                            $element[0].focus();
                        }
                    }, 0, false);
                }
            });
        }
    }
})

Answer 3

为了解决这个问题，我们可能会决定将资源包装在我们自己的服务中。我们的服务将进行手动差异，并且仅在发生任何更改时才更新模型。