$ http请求在更新angular-ui-sortable列表时陷入无限循环

时间:2014-12-03 19:57:47

标签: javascript angularjs http angular-ui

我有一个MEAN应用程序我正在努力。我正在使用angular ui sortable来管理列表。

我想在刷新页面时保留列表的顺序。以下函数为数组中的每个$http.post对象提交present请求。

如果我使用按钮触发它,它可以正常工作。但我希望每次用户更新列表的顺序时都会触发它。

$scope.sortPresents = function() {
    for (var j=0; j < $scope.presents.length; j++) {
        $scope.presentClientToDB(j);
    }
};

$scope.presentClientToDB = function(a) {

    var tmpId = $scope.presents[a]._id;

    $http.post('/api/presents/' + tmpId, {
        title: $scope.presents[a].title,
        notes: $scope.presents[a].notes,
        link: $scope.presents[a].link,
        index: $scope.presents[a].index
    })
    .success(function(data) {
        console.log('great success posting data!');
    })
    .error(function(data) {
        console.log('error: ' + data);
    });
};

在我的view中,我在更新列表时调用此sortPresents()函数:

<ul ui-sortable="{update: sortPresents()}" ng-model="presents" class="list-group">
    ...
</ul>

冻结我的应用并在我的终端中导致重复POST次请求(在Express端,使用morgan)。

我知道当我点击并拖动列表项时,会重复调用ui-sortable的update函数。所以我尝试将函数作为stop方法放置,但无济于事。

有关如何修复或更好地实现此问题的任何想法?

1 个答案:

答案 0 :(得分:0)

在你的ui-sortable选项中,你需要设置函数变量 - 不调用函数。所以改为ui-sortable="{stop: sortPresents}"(没有括号):

<ul ui-sortable="{stop: sortPresents}" ng-model="presents" class="list-group">
    ...
</ul>