ng-keypress 在 angularjs 中调用函数

Question

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

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

第一个解决方案

<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: Cannot read property 'which' of undefined

我应该在依赖性上添加一些东西吗？

Answer 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>

Answer 2

只要把表单标签包围起来就可以了

<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>

Answer 3

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

如果浏览器支持event.which，则使用event.which，否则使用event.keyCode
event.keycode/event.which 将读取 which key strocked 和 relative numeric value it will return.

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

<input type="text" onkeypress="init(event)">

function init(event){

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

alert(x);

}

这与 ng-keypress 无关，只是哪个不是响应值，它将取决于浏览器，因为某些值会来吧，所以使用上面提到的代码。

ng-keypress 在 angularjs 中调用函数

ng-keypress to call function in angularjs

javascript

html

angularjs

dom-events

event-driven