標籤：
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>註冊</title> <script src="./node_modules/angular/angular.js"></script></head><body ng-app="s1.app"><div> <div> <label for="ipt_name">使用者名稱</label> <input ng-model="data.name" type="text" id="ipt_name"> <span ng-bind="data.errorMsg.name"></span> </div> <div> <label for="ipt_password">密碼</label> <input ng-model="data.password" type="password" id="ipt_password"> </div> <div> <label for="ipt_age">年齡</label> <input ng-model="data.age" type="number" id="ipt_age"> </div> <div> <label for="ipt_phone">手機</label> <input ng-model="data.phone" type="tel" id="ipt_phone"> </div> <div> <button ng-click="actions.submit()">註冊</button> </div></div><script> // app是application的縮寫，application是應用程式的意思 var app = angular.module(‘s1.app‘, []); app.run(function ($rootScope) { // data是資料的意思 var data = $rootScope.data = {}; data.name = ‘‘; data.password = ‘‘; data.age = 0; data.phone = ‘‘; data.errorMsg = {}; // actions是行為的意思 var actions = $rootScope.actions = {}; actions.submit = function () { var userinfo = {}; if(data.name == ‘‘){ data.errorMsg.name = ‘使用者名稱不可為空‘; return; } userinfo.name = data.name; userinfo.password = data.password; userinfo.age = data.age; userinfo.phone = data.phone; // 從資料對象上拿到我們想要的資料，然後做提交（現在我們沒有伺服器，只是log一下） console.log(userinfo); } })</script></body></html>
使用angular.js擷取form表單中的資訊
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
