4

我有一个网站，我需要在点击事件上获得一些去抖功能，并且我已经在网上搜索以找到合适的解决方案，但一直无法。

我有两个链接，每个链接都有自己的数据类型，这些数据在下面的列表中使用。

<li ng-class="{'active' : type == 'own'}">
    <a ng-click="changeType('own')" href="#"><span aria-hidden="true" class="icon icon-user"></span> Mine arbejdsgrupper</a>
</li>
<li ng-class="{'active' : type == 'all'}">
    <a ng-click="changeType('all')" href="#"><span aria-hidden="true" class="icon icon-cabinet"></span> Foreslåede arbejsgrupper</a>
</li>

如果我快速切换，（单击第一个，然后是第二个）异步获取获取数据无法遵循，所以即使我先单击第二个，我也会从列表中的第一个链接获取内容。

我可以看到有一个 ng-model-options，但我不知道我是否可以在这里。如果我需要使用下划线去抖动，我会很难过，所以我需要 $scope.$apply 对范围的每个更改。

有人对此有一些想法吗？

编辑！

一个朋友发给我这个。 如何在AngularJS中编写去抖动服务 应该可以解决问题。

4

1 回答 1

2

你在错误的层面上考虑这个问题。根据经验，我认为 UI 应该只有非常简单的交互，主要是函数调用，即我尝试限制 UI 中的表达式和逻辑。

所以我会在这些方法被点击后在控制器中去抖动。

angular.module('app-controlllers').controller('ACtrl', [
'$scope',
function ($scope) {
    var debounceAllFn = _.debouce(function () {
        // your actual function implementation
    }. 500),
    debounceOwnFn = _.debouce(function () {
        // your actual function implementation
    }. 500);

    $scope.changeType = function (type) {
        switch (type.toLowerCase()) {
            'all' : 
                debounceAllFn();
                break;
            'own' : 
                debounceOwnFn();
                break;
        }
    }
}
]);
于 2014-07-02T07:29:46.783 回答