防止多投安古拉杰
开始为我的英语道歉。
我对这个问题做了一些调查，但对我没有任何用处。
我的问题很简单：
我有一个向上投票系统，用户可以在这里向上投票(比如Stackoverflow)。但问题是用户可以多次投票(而且不是很好.)。
我试着制作一个禁用ng的按钮，但是如果我这样做，用户只能为所有的帖子投票一次(我的意思是，如果他们投了"Post A"，他们就不能投"Post B")。
以下是我的控制器功能：
$scope.incrementUpvotes = function(post) {
posts.upvote(post);
};这是我的工厂功能：
o.upvote = function(post){
return $http.put('/posts/' + post._id + '/upvote', null, {
headers: {Authorization: 'Bearer '+auth.getToken()}
}).success(function(data){
post.upvotes += 1;
});
};在这里，html：
<span class="glyphicon glyphicon-thumbs-up" ng-click="incrementUpvotes(post)"></span>如果有人能帮我，那就太好了！提前谢谢！
回答 3
Stack Overflow用户
发布于 2016-04-21 16:23:51
请尝试使用button或input而不是span。因为disabled不工作在span中。
<button id="{{ post._id + 'upvote' }}" class="glyphicon glyphicon-thumbs-up" ng-click="incrementUpvotes(post)"></button>然后，在“向上投票”操作之后，将“向上投票”的disabled属性设置为“button true”。
o.upvote = function(post){
return $http.put('/posts/' + post._id + '/upvote', null, {
headers: {Authorization: 'Bearer '+auth.getToken()}
}).success(function(data){
post.upvotes += 1;
angular.element(document.getElementById(post._id + 'upvote' ))[0].disabled = true;
});
};Stack Overflow用户
发布于 2016-04-21 16:34:54
这更像是一个架构问题，而不是javascript/angularjs问题。有很多方法可以做到这一点。但这样做的目的是存储在数据库中，并保存向上表决信息，否则用户只需刷新页面并再次更新。
最直接的解决方案是:您必须将您的投票信息存储在后端的用户级别。当您查询用户信息时，存储如下所示的向上投票的帖子列表：
myDataService 应该如下所示：
angular.module("app", []).service("myDataService", ["$http","$q","$rootScope", function myDataService($http, $q, $rootScope) {
var myDataService = this;
myDataService.getPostsUpvoted = function(userId) {
var defer = $q.defer();
//here you format your payload to deliver userId to the api backend
var payload = { userId: userId };
//your api backend 'getpostsupvoted' should accept a userId, then in return it should
//deliver a list of posts upvoted by that user
$http.post("/api/getpostsupvoted", payload).then(function (data, status, headers, config) {
//call success
defer.resolve(data);
}, function(data, status, headers, config) {
//an error occurred
defer.reject(data);
});
return defer.promise;
}
return myDataService;
})];然后，您将在控制器中使用该服务。
//inject scope and myDataservice into controller
angular.module("app", []).controller("MainCtrl", ["$scope", "myDataService", function($scope, myDataService) {
//create a new array to hold a list of upvotes
$scope.user.upVoted = [];
myDataService.getPostsUpvoted($scope.user.id).then(function(data) {
//set upvoted array to data
$scope.user.upVoted = data;
}, function(error) {
//blah an error occurred
});
})];在您的控制器中，提供一个函数来检查post是否已经被选中。
$scope.IsUpvotedAlready = function(postId) {
if($scope.user.upVoted.indexOf(postId) > -1)
return true;
return false;
}您还必须将post._id推到upVoted数组，并将其保存在那里。
$scope.incrementUpvotes = function(post) {
//check if it's already been upvoted, then do nothing
if($scope.user.upVotes.indexOf(post._id) > -1)
return;
posts.upvote(post);
$scope.user.upVoted.push(post._id);
};然后，在显示post的ng-重复指令中，检查向上的列表是否包含post._id。
<div ng-repeat="post in posts">
<div ng-if="IsUpvotedAlready(post._id)">
<!-- display something since already upvoted !-->
</div>
{{ post }}
</div>Stack Overflow用户
发布于 2016-04-21 16:30:47
在模板中，当您迭代这些帖子时，为每个帖子设置一个标志，以标识它是否已被更新。
在upvote函数中，将该标志标记为true，并在ng-disabled指令中使用它，如下所示：
ng-disabled={{post.isUpvoted}}https://stackoverflow.com/questions/36775275
复制相似问题
腾讯云开发者
