我使用 Angular 构建了一个简单的表单。 我希望一旦用户输入一些值然后按 Enter 键 - ng-click 函数(在本例中 updateMsg({name: name,room: room}))就会运行。
但是，这段代码不是这样工作的..该函数仅在按下按钮后运行(不像我想要的 - 输入键盘值，然后输入..)
代码如下...
请帮忙？
谢谢
<body>
<div class="Member">
<h1>Sign In</h1>
<form name="myForm" ng-submit="updateMsg({name: name,room: room})">
Please enter your details:
<br>
Name: <input name="name" ng-model="name" autocomplete="off">
<br>
Room: <input name="room" ng-model="room" autocomplete="off">
<br>
<button type="button" ng-click="updateMsg({name: name,room: room})">
Enter
</button>
</form>
</div>
</body>
最佳答案
您不应同时使用 ng-click 和 ng-submit 指令。将 type="submit" 添加到您的按钮，如下所示:
<button type="submit">Enter</button>
并仅保留ng-submit:
<form name="myForm" ng-submit="updateMsg({name: name,room: room})">
Please enter your details:
<br> Name:
<input name="name" ng-model="name" autocomplete="off">
<br> Room:
<input name="room" ng-model="room" autocomplete="off">
<br>
<button type="submit">Enter</button>
</form>
此外，执行 ng-submit="updateMsg({name: name,room: room})" 来传递更新的数据是没有意义的。由于您正在使用 ng-model，您就可以开始了。您可以最初在 Controller 中声明范围变量，提交表单后您可以立即使用它们。由于双重绑定(bind)，您的变量将已经更新:
angular
.module('myApp', [])
.controller('MemberController', ['$scope', function($scope) {
$scope.name = '';
$scope.room = '';
$scope.updateMsg = function() {
// use updated $scope.name in here
// use updated $scope.room too
}
}]);
小plunker为您提供更多帮助。
关于javascript - 在文本字段之一上按 Enter 键时， Angular ngsubmit() 指令不会提交，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/38440775/