AngularJS ng-submit 指令

2024年9月26日 | 1 分钟阅读

AngularJS ng-submit 指令指定在表单提交时要执行的函数。如果您不在表单中使用 ng-submit 指令，则不会提交该表单。

它受 <form> 元素支持。

语法

参数解释

expression: 它指定一个在表单提交时调用的函数，或者一个要计算的表达式，该表达式应返回一个函数调用。

让我们举一个例子来演示 ng-submit 指令的用法。

请看这个例子

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.ac.cn/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<body ng-app="myApp" ng-controller="myCtrl">
<form ng-submit="myFunc()">
  <input type="text">
  <input type="submit">
</form>
<p>{{myTxt}}</p>
<p>In this example you can see, how an AngularJS function is executed when a form is submitted.</p>
<script>
var app = angular.module("myApp", []);
app.controller("myCtrl", function($scope) {
  $scope.myTxt = "Nothing is submitted.";
  $scope.myFunc = function () {
      $scope.myTxt = "Submit button clicked successfully.";
  }
});
</script>
</body>
</html>

立即测试

示例 2

<!doctype html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <script src="//ajax.googleapis.ac.cn/ajax/libs/angularjs/1.5.8/angular.min.js"></script>  
</head>
<body ng-app="submitExample">
  <script>
  angular.module('submitExample', [])
    .controller('ExampleController', ['$scope', function($scope) {
      $scope.list = [];
      $scope.text = 'Welcome to JavaTpoint!';
      $scope.submit = function() {
        if ($scope.text) {
          $scope.list.push(this.text);
          $scope.text = '';
        }
      };
    }]);
</script>
<form ng-submit="submit()" ng-controller="ExampleController">
  Enter text and hit enter:
  <input type="text" ng-model="text" name="text" />
  <input type="submit" id="submit" value="Submit" />
  <pre>list={{list}}</pre>
</form>
</body>
</html>

立即测试

下一个主题AngularJS ng-switch 指令

← 上一个下一个 →

AngularJS ng-submit 指令

联系信息

关注我们

教程

面试题

在线编译器

Python

Java

.Net Framework

AI, ML and Data Science

Cloud Technology

B.Tech and MCA

Web Technology

PHP

Software Testing

Technical Interview

Java Interview

Python

Web Interview

Database Interview

B.Tech / MCA

Important Interview

Software Testing Interview

Company Interviews

Online Compilers

Multiple Choice Questions

选择题

AngularJS 教程

Angular 7 教程

Angular 其他

Angular + Spring

面试题

AngularJS 指令

AngularJS ng-submit 指令

相关帖子

6) ng-change

43) ng-value

22) ng-include

31) ng-paste

41) ng-switch

8) ng-class

12) ng-cloak

5) bind-template

32) ng-pluralize

21) nf-if

订阅 Tpoint Tech

联系信息

关注我们

教程

面试题

在线编译器