在指令中處理HTTP動詞的最佳方法

Question

我正在學習Django和Angular開發中的Pluralsight課程。 我對這兩種框架都非常陌生，但是有其他語言和框架的經驗。

在課程中，我們展示了如何在ng-change期間調用debounce作為選項的函數。 此功能update使用http.put將放置請求發送到本地REST API。

但是，與以前的語言一起工作時，使用ng-change將請求發送到Web服務的想法（甚至將debounce設置為500）似乎是一個很愚蠢的想法，因為將有很多不必要的流量發送到該服務。

一個人如何做得更好？ 我試圖將ng-click設置為觸發該update ，但由於某種原因似乎沒有觸發該事件...

由於我不確定是否應使用此方法，因此代碼中缺少了反跳功能。

編輯：

如答案之一所述，如果我使用自動更正/填充功能進行某種控制中搜索，那么使用ng-keyup可能是一個好主意，但是在這種情況下，我擔心提交（更新）使用ng-keyup或ng-change發出put請求的數據庫中的數據會產生過多的開銷流量。

---

card.html

<div class="card" ng-hide="edit" ng-click="edit=true">
    <h4> {{ card.title }} </h4>
    <span class="description"> {{ card.description }} </span>
</div>

<div class="card" ng-show="edit">
    <div class="flex">
        <label><strong>Title: &nbsp;</strong></label>
        <input type="text" ng-model="card.title"
                           ng-change="update()" />
    </div>
    <textarea ng-model="card.description"
              ng-change="update()"
              placeholder="Enter description here..."></textarea>
    <button ng-click="edit=false">Close</button>
</div>

card.directive.js ：

(function () {
    "use strict";

    angular.module('scrumboard.demo')
        .directive('scrumboardCard', CardDirective);

    function CardDirective() {
        return {
            templateUrl: "/static/scrumboard/card.html",
            restrict: 'E',
            controller: ['$scope', '$http', function ($scope, $http) {
                let url = '/scrumboard/cards/' + $scope.card.id + '/';
                console.log("Inside");
                $scope.update = function() {
                    console.log("I'm inside");
                    $http.put(url, $scope.card)
                        .finally(function() {
                           edit = false;
                    });
                };
            }]

        };
    }
})();

Answer 1

通常建議在文本搜索中使用ngKeyup而不是ng-change，

<textarea ng-model="card.description"
               ng-keyup="update()"
              placeholder="Enter description here..."></textarea>