在这个特殊的情况下,我有什么选项,使这些输入调用函数时,我按下Enter?
Html:
<form>
<input type="text" ng-model="name" <!-- Press ENTER and call myFunc --> />
<br />
<input type="text" ng-model="email" <!-- Press ENTER and call myFunc --> />
</form>
// Controller //
.controller('mycontroller', ['$scope',function($scope) {
$scope.name = '';
$scope.email = '';
// Function to be called when pressing ENTER
$scope.myFunc = function() {
alert('Submitted');
};
}])
Angular提供了开箱即用的支持。你在表单元素上尝试过ngSubmit吗?
<form ng-submit="myFunc()" ng-controller="mycontroller">
<input type="text" ng-model="name" />
<br />
<input type="text" ng-model="email" />
</form>
编辑:根据关于提交按钮的评论,请参阅通过按enter不提交按钮提交表单,其中给出了解决方案:
<input type="submit" style="position: absolute; left: -9999px; width: 1px; height: 1px;"/>
如果您不喜欢隐藏的提交按钮解决方案,则需要将控制器函数绑定到Enter keypress或keyup事件。这通常需要一个自定义指令,但AngularUI库已经设置了一个很好的按键解决方案。参见http://angular-ui.github.com/
添加angularUI库后,你的代码会像这样:
<form ui-keypress="{13:'myFunc($event)'}">
... input fields ...
</form>
或者您可以将回车键绑定到每个单独的字段。
另外,请参阅创建简单keypres指令的SO问题:
如何在AngularJS中检测onKeyUp ?
编辑(2014-08-28):在写这个答案的时候,ng-keypress/ng-keyup/ng-keydown还不存在于AngularJS中。在下面的评论中@darlan-alves有一个很好的解决方案:
<输入ng -keyup = " $事件。==地理==根据美国人口普查,这个县的总面积为,其中土地和(0.991平方公里)水。/>