可以帮助我使用AngularJS将数据从一个页面发送到另一个页面。
服务代码
var module = angular.module('app', []);
module.service('ContactService', function () {
var uid = 1;
var contacts = [{
id: 0,
'fname': 'Supriya',
'mobile': '8985335701',
'mail': 'hello@gmail.com',
'age': '20',
'gender' : 'female'
}];
this.save = function (contact) {
if (contact.id == null) {
contact.id = uid++;
contacts.push(contact);
} else {
for (i in contacts) {
if (contacts[i].id == contact.id)
{
contacts[i] = contact;
}
}
}
}
this.list = function () {
return contacts;
}
});
控制器代码:
module.controller('ContactController', function ($scope, ContactService) {
$scope.contacts = ContactService.list();
$scope.saveContact = function () {
ContactService.save($scope.newcontact);
$scope.newcontact = {};
}
})
Html页面:
<body>
<div ng-app="app" ng-controller="ContactController">
<form>
<label>Full Name:</label>
<input type="text" ng-model="newcontact.fname"><br>
<label>Mobile Number:</label>
<input type="text" ng-model="newcontact.mobile"> </br>
<label> E-Mail:</label>
<input type="email" ng-model="newcontact.mail"> </br>
<label> Age:</label>
<input type="text" ng-model="newcontact.age"> </br>
<label> Gender: </label>
<input type="radio" ng-model="newcontact.gender" value="male">Male
<input type="radio" ng-model="newcontact.gender" value="female">Female
<input type="hidden" ng-model="newcontact.id" />
<br>
<input type="button" value="Save" ng-click="saveContact()" />
<table border=1px>
<thead>
<tr>
<th>Full Name</th>
<th>Mobile Number</th>
<th>Email</th>
<th>Age</th>
<th>Gender</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="contact in contacts">
<td>{{ contact.fname }}</td>
<td>{{ contact.mobile }}</td>
<td>{{ contact.mail }}</td>
<td>{{ contact.age }}</td>
<td>{{ contact.gender }}</td>
</tr>
</tbody>
</table>
</div>
</body>
点击保存按钮后,表格中输入的详细信息应发送到另一个名为index.html
的页面。
答案 0 :(得分:1)
使用服务是正确的方向。这就是你如何坚持并在控制器之间传递数据。
似乎需要绑定以使控制器可以访问您的函数。通过绑定我的意思是,在你的控制器中,你需要创建一个带来服务功能的函数。看起来多余,但它是关于Angular 1.X最烦人的事情之一 所以试试:
this.save = save;
和
this.list = list;
在您的服务代码块中,在您定义服务中的功能后,您的控制器就可以访问它们。
在我的代码“@ public functions”https://github.com/usrrname/shopapp/blob/master/app/site/services/products.srv.js
下查看此操作希望有所帮助。我对框架也很陌生。