这是 main.html 文件，其中包含到包含注册表单的页面 post_es.html 的路由。如果用户是新用户，注册表单会显示消息“用户创建成功”，否则会显示“具有相同电子邮件地址的用户已存在”。问题是当 post_es.html 通过 main.html 打开时，注册表单不起作用，但如果直接从 url 打开注册表单，则它可以正常工作。我希望通过路由通过 main.html 打开 post_es.html 后它应该正常工作。请帮忙。
Main.html 文件
<!DOCTYPE html>
<html ng-app="demoApp">
<head>
<title>AngularJs Post Example </title>
<script type="text/javascript" src="angular.min.js"></script>
</head>
<body>
<a href="#/post_es" >Add</a>
<div ng-view=""></div>
<script type="text/javascript">
var demoApp = angular.module('demoApp',[]);
demoApp.config( function($routeProvider){
$routeProvider
.when('/',
{
controller: 'SimpleController',
templateUrl : 'partial/view1.html'
})
.when('/post_es',
{
controller :'SimpleController',
templateUrl:'post_es.html'
})
.otherwise({redirectsTo:'/'});
});
</script>
</body>
</html>
post_es.html
<!DOCTYPE html>
<html ng-app>
<head>
<title>AngularJs Post Example </title>
<script type="text/javascript" src="angular.min.js"></script>
<style>
#dv1{
border:1px solid #DBDCE9; margin-left:auto;
margin-right:auto;width:220px;
border-radius:7px;padding: 25px;
}
.info{
border: 1px solid;margin: 10px 0px;
padding:10px;color: #00529B;
background-color: #BDE5F8;list-style: none;
}
.err{
border: 1px solid; margin: 10px 0px;
padding:10px; color: #D8000C;
background-color: #FFBABA; list-style: none;
}
</style>
</head>
<body>
<div id='dv1'>
<form ng-controller="FrmController">
<ul>
<li class="err" ng-repeat="error in errors"> {{ error}} </li>
</ul>
<ul>
<li class="info" ng-repeat="msg in msgs"> {{ msg}} </li>
</ul>
<h2>Sigup Form</h2>
<div>
<label>Name</label>
<input type="text" ng-model="username" placeholder="User Name" style='margin-left: 22px;'>
</div>
<div>
<label>Email</label>
<input type="text" ng-model="useremail" placeholder="Email" style='margin-left: 22px;'>
</div>
<div>
<label>Password</label>
<input type="password" ng-model="userpassword" placeholder="Password">
</div>
<button ng-click='SignUp();' style='margin-left: 63px;margin-top:10px'>SignUp</button>
</form>
</div>
<script type="text/javascript">
function FrmController($scope, $http) {
$scope.errors = [];
$scope.msgs = [];
$scope.SignUp = function() {
$scope.errors.splice(0, $scope.errors.length); // remove all error messages
$scope.msgs.splice(0, $scope.msgs.length);
//http.post passes the data to post_es.php
$http.post('post_es.php', {'uname': $scope.username, 'pswd': $scope.userpassword, 'email': $scope.useremail}
).success(function(data, status, headers, config) {
if (data.msg != '')
{
$scope.msgs.push(data.msg);
}
else
{
$scope.errors.push(data.error);
}
}).error(function(data, status) {
$scope.errors.push(status);
});
}
}
</script>
</body>
</html>
post_es.php
$data = json_decode(file_get_contents("php://input"));
$usrname = mysql_real_escape_string($data->uname);// extracting username from $data
$upswd = mysql_real_escape_string($data->pswd);
$uemail = mysql_real_escape_string($data->email);
$con = mysql_connect('localhost', 'root', ''); // creating connection with database
mysql_select_db('sample', $con);// here sample is the name of database
$qry_em = 'select count(*) as cnt from users where email ="' . $uemail . '"';
$qry_res = mysql_query($qry_em);
$res = mysql_fetch_assoc($qry_res);
if($res['cnt']==0){
$qry = 'INSERT INTO users (name,email,pass) values ("' . $usrname . '","' . $uemail . '","' . $upswd . '")'; // insert query to insert new record
$qry_res = mysql_query($qry);
if ($qry_res) {
$arr = array('msg' => "User Created Successfully!!!", 'error' => '');
$jsn = json_encode($arr);
print_r($jsn);
} else {
$arr = array('msg' => "", 'error' => 'Error In inserting record');
$jsn = json_encode($arr);
print_r($jsn);
}
}
else
{
$arr = array('msg' => "", 'error' => 'User Already exists with same email');
$jsn = json_encode($arr);
print_r($jsn);
}
?>
最佳答案
您需要使用ng-submit指令:
<form ng-submit="SignUp()">
您的 Controller 中有一个名为 SignUp 的函数从 <form> 调用该函数元素。将 Controller 移至<div>表单中较高的元素:
<div id='dv1' ng-controller="FrmController">
<form ng-submit="SignUp()">
关于php - 在 angularjs 中定义路由后，注册表单不起作用，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/20956223/