AngularJS / IonicFramework 防止在切换时调用多个 API答案

【问题标题】：AngularJS / IonicFramework prevent multiple API calls on toggleAngularJS / IonicFramework 防止在切换时调用多个 API
【发布时间】：2015-08-12 08:25:04
【问题描述】：

我已阅读此内容并正在尝试实现类似的功能

“如果您使用切换按钮，例如：打开和关闭某些东西并且它到达 API 端点，请确保将该交互包装在计时器中，这样您就不会在用户决定时多次调用该端点快速连续多次点击控件。稍等片刻，然后点击终点。"

我有一个带有一系列拨动开关的设置页面。我不想在每次切换时都进行 API 调用，而是希望延迟将范围值传递给服务器的 API 调用。我想将它延迟 X 秒。但是，通过这样做

    $scope.settingsChange = function () {

        $timeout(function () {
            //save_notifications
            console.log('called');
           // Trigger API call
        }, 3000);
    };

所有这一切只是将通话延迟了 3000 毫秒。如果我切换 3 次，我仍然会出现 3 次控制台日志。

我完全清楚这是因为我实现了超时功能。我不确定要实现什么才能获得海报在上面引用中提到的功能。

非常感谢任何想法。

谢谢，

注意：我的模板是这样的

        <ion-toggle ng-repeat="item in settingsData"
                    ng-model="item.checked"
                    ng-checked="item.checked"
                    ng-change="settingsChange()">
            {{ item.text }}
        </ion-toggle>

【问题讨论】：

标签： javascript angularjs ionic-framework

【解决方案1】：

一旦您启动 API 调用，请阻止进行任何其他调用。

$scope.settingsChange = function () {

  if ($scope.processingSettingChange) return;
  $scope.processingSettingChange = true;

    $timeout(function () {
        //save_notifications
        console.log('called');
       // Trigger API call
       $scope.processingSettingChange = false;
    }, 3000);
};

您可能还想在 API 处理请求时禁用 UI。您应该能够使用相同的$scope 变量和ng-disabled

【讨论】：