在指令中处理http谓词的最佳方法

Question

我沿着Django的Pluralsight课程和角的发展。我是非常熟悉这两个框架的，但有使用其他语言和框架的经验。

在本课程中，我们将向您展示如何使用debounce作为一个选项，其中包含在ng-change期间调用的函数。这个函数update使用http.put向本地REST发送put请求。

然而，在使用了以前的语言之后，使用ng-change向web服务发送请求的想法(即使debounce设置为500)似乎是一个非常愚蠢的想法，因为会有大量不必要的通信被发送到该服务。

怎么才能做得更好呢？我试图把ng-click的按钮设置为启动update，但由于某种原因，它似乎没有触发事件.

由于我不确定是否应该使用这种方法，所以代码中缺少了这个方法。

编辑：

正如其中一个答案所提到的，如果我使用自动更正/填充进行某种控制搜索，那么使用ng-keyup可能是个好主意，但在这种情况下，我担心使用put请求使用ng-keyup或ng-change在数据库中提交(更新)数据会造成过多的开销。

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更改，

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