<!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>
原文:http://www.cnblogs.com/lsy0403/p/5927990.html