ng-keypress 在 angularjs 中调用函数答案

【问题标题】：ng-keypress to call function in angularjsng-keypress 在 angularjs 中调用函数
【发布时间】：2015-09-24 09:13:01
【问题描述】：

我有发送按钮，然后单击该按钮从输入中发送文本。我还想在输入键盘上发送该文本。我尝试了两种解决方案，但什么都没有..

你可以在下面找到我的代码：

第一个解决方案

<div class="modal-footer">
                <input id="enterText" name="enterText" class="form-control" aria-describedby="basic-addon1"
                       ng-model="modalInstanceController.showText" ng-keypress="keyEnter($event)">
                <br/>
                <button class="btn btn-primary" type="button" ng-click="modalInstanceController.concatConversation()"
                        ng-keypress="$event.which === 13 && modalInstanceController.concatConversation()">Send
                </button>
        </div>

第二种解决方案

我用发送按钮调用这个函数：

 $scope.modalInstanceController.concatConversation = function () {

            $scope.modalInstanceController.currentConversation.push({
                loggedUser: $scope.modalInstanceController.showText,
                user: 'typing...'
            });
            $scope.modalInstanceController.showText = "";

        };

我也尝试在keyEnter函数中调用这个函数：

$scope.modalInstanceController.keyEnter = function (keyEvent) {
            if (keyEvent.which === 13) {
                $scope.modalInstanceController.currentConversation.push({
                    loggedUser: $scope.modalInstanceController.showText,
                    user: 'typing...'
                });
                $scope.modalInstanceController.showText = "";
            }
        };

$scope.modalInstanceController.keyEnter();

在 html 中：

<button class="btn btn-primary" type="button" ng-click="modalInstanceController.concatConversation()"
                        ng-keypress="modalInstanceController.keyEnter($event)">Send
                </button>

我收到错误：

TypeError: 无法读取未定义的属性 'which'

我应该添加一些依赖还是什么？

【问题讨论】：

标签： javascript html angularjs dom-events event-driven

【解决方案1】：

你可以试试

if (keyEvent.keyCode === 13)

还有一件事

<button class="btn btn-primary" type="button" ng-click="modalInstanceController.concatConversation()"
                        ng-keypress="$event.keyCode === 13 && modalInstanceController.concatConversation?modalInstanceController.concatConversation():''">Send
            </button>

【讨论】：

【解决方案2】：

我正在添加一些主要的事件概念。

如果浏览器支持event.which，则使用event.which，否则使用event.keyCode
event.keycode/event.which 将读取敲击了哪个键以及它将返回的相对数值。

您可以在javascript中测试下面的代码，只需复制下面的代码并尝试使用它。

函数初始化（事件）{

var x = event.which ||事件.keyCode;

警报（x）；

}

这与ng-keypress无关，只是哪个没有响应值，这取决于浏览器，因为会有一些值，所以使用上面提到的代码.

【讨论】：

【解决方案3】：

只需将表单标签包围它

<div class="modal-footer">
<form>
                <input id="enterText" name="enterText" class="form-control" aria-describedby="basic-addon1"
                       ng-model="modalInstanceController.showText" ng-keypress="keyEnter($event)">
                <br/>
                <button class="btn btn-primary" type="button" ng-click="modalInstanceController.concatConversation()"
                        ng-keypress="$event.which === 13 && modalInstanceController.concatConversation()">Send
                </button>
</form>
        </div>

【讨论】：