Question

我刚开始学习AngularJS，我的第一页需要拦截提交。我想使用 ng-submit 指令，但我的代码似乎有问题：

<html ng-app>
<head>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.9/angular.min.js"></script>

<script>
function MyFormController($scope) {
  scope.add = function(field) {   
    alert(field);
 };
}
</script>
<body>
<div ng-controller="MyFormController">
<form ng-submit="add(field)">
  <input type="text" name="field" ng-model="field" />
  <input type="submit" value="Submit" />
</form>
</div>
</body>
</html>

我添加了一个alter来查看是否调用了add函数，但是没有显示任何内容。我想这肯定是一个愚蠢的问题，但我无法抓住它。有帮助吗？
谢谢！

Answer 1

您可以在不使用参数的情况下保存值：

<script>
function MyFormController($scope) {
  $scope.add = function() {   
    alert($scope.field);
 };
}
</script>

<body>

<div ng-controller="MyFormController">

  <form ng-submit="add()">
    <input type="text" name="field" ng-model="field" />
    <input type="submit" value="Submit" />
  </form>

</div>

</body>

Answer 2

请试一试。

<script>
function MyFormController($scope) {
  $scope.add = function(field) {   
    alert($scope.field);
 };
}
</script>
<body>
<div ng-controller="MyFormController">
<form ng-submit="add()">
  <input type="text" name="field" ng-model="field" />
  <input type="submit" value="Submit" />
</form>
</div>
</body>
</html>

AngularJS ng-submit to intercept form submit

2 个答案: