javascript - 如何将输入和 HTTP get 结合起来

Question

我正在尝试将输入文本与 HTTP get 结合起来。我尝试了一些有效的方法，但它不是我想要的。我有一些像这样的 URL http://localhost/web.php?tN=false&f5=kakaf5 从 HTML 中的输入中获取一些数据。这是我的 HTML

<div class="list">
    <label class="item item-input item-floating-label">
        <span class="input-label"><i class="glyphicon glyphicon-user"></i> Username</span>
        <input id="inputPassword" class="form-control" placeholder=" Username" name="loginname" type="text" ng-model="loginData.username" ng-click="submitFunction()" required>
    </label>
    <label class="item item-input item-floating-label">
        <span class="input-label"><i class="glyphicon glyphicon-lock"></i> Password</span>
        <input id="inputPassword" class="form-control" placeholder=" Password" name="password" type="password" ng-model="loginData.password" required>
    </label>
</div>

这是我的 Controller

$scope.submitFunction = function() {
    kaka.falselogin($scope.loginData.username).success(function(data) {
        console.log(data);
    });
};

我的问题是我必须在输入表单用户名后单击才能获取数据。如果我必须在表单用户名输入后获取数据，那就很复杂有人有主意吗？请帮助我解决我的问题。谢谢

Answer 1

您可以只使用ng-change指令。只要输入的值发生变化，它就会运行提供的函数。

<input id="inputPassword" class="form-control" placeholder=" Username" name="loginname" type="text" ng-model="loginData.username" ng-change="submitFunction()" required>

考虑到您在每次更改时发出 HTTP 请求，您基本上会淹没服务器。要解决该问题，您可以对模型进行去抖动处理，这样需要 x 毫秒才能应用新值。

ng-model-options='{ debounce: 1000 }'

结合起来，它看起来像这样:

<input id="inputPassword" class="form-control" placeholder=" Username" name="loginname" type="text" ng-model="loginData.username" ng-model-options='{ debounce: 1000 }' ng-change="submitFunction()" required>

就这样吧:)