如何从Html文件发送数据到另一个使用角?

时间:2017-04-14 14:46:39

标签: html angularjs spring

我尝试在html文件中以表格形式获取一些数据的示例项目..然后将其传递给spring服务..成功返回对象..现在我想将此对象传递给另一个Html fie来显示

表单的Html文件:

<!DOCTYPE html>
<html ng-app="phase2">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<head>
<title>Sign UP Page</title>
<script src="RigesterationController.js"></script>

</head>
<body >

<center>

<p>Enter Your User Name :	<input type="text" , name="UserName" id ="UName"  required /> </p>
<p>Enter Your Email :	<input type="text" , name="Email" id ="email" required /> </p>
<p>Enter Your Password :	<input type="password" , name="pass" id ="Pass" required/> </p>
<p>Choose Gender : <br> Male<input type="radio" name="gender" value="m" id="Gender" />    Female<input type="radio" name="gender" value="f" id="Gender"/> </p>
<p>Choose User Type :<br>  Student<input type="radio" name="UserType" value="s" id="Utype" />     Teacher<input type="radio" name="UserType" value="t" id="Utype"/> </p>

<div ng-controller="SignUP">
<input type="button" name="signup" value="SignUP" ng-click="save()" />
</div>

</center>
</body>
</html>

RigesterationController.js文件:

angular.module("phase2" , [])

.controller("SignUP" , function($scope , $http )
{
	var dat ;
	$scope.save = function() {
		var email= document.getElementById("email").value;
		var UName=document.getElementById("UName").value;
		var Pass=document.getElementById("Pass").value;
		var gender=document.getElementById("Gender").value;
		var UserType=document.getElementById("Utype").value;
		var Info ;
		$http.get('http://localhost:8090/SignUp/'+email+'/'+UName+'/'+Pass+'/'+gender+'/'+UserType)
		.then(function(response)
			{
				Info = response.data;
				dat=Info ;
				alert(dat.name) ;
				window.location.href="http://localhost:8060/TheAngular_Project/StudentPage.html";
			});
		
		}
	
});

第二个Html文件:

<!DOCTYPE html>
<html ng-app="phase2">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<script src="RigesterationController.js"></script>
<head>
<title>Student Page</title>

</head>

<body>
<div ng-controller="SignUP">
<p><span class="name">Welcome  {{dat.name}}</p>
</div>
</body>
</html>

现在第二个html文件中的dat.name中没有出现任何内容。 虽然..在regestrationController.js ..我在一个allert中测试dat.name并且它成功地出现了.. 提前谢谢

1 个答案:

答案 0 :(得分:0)

我在这篇文章中找到了Wawy的答案。 [AngularJS - Passing data between pages

您需要创建一个服务才能在控制器之间共享数据。

app.factory('myService', function() {
 var savedData = {}
 function set(data) {
   savedData = data;
 }
 function get() {
  return savedData;
 }

 return {
  set: set,
  get: get
 }

});

在你的控制器A:

myService.set(yourSharedData);

在您的控制器B中:

$scope.desiredLocation = myService.get();

请记住将myService作为参数传递给控制器​​。