Question

您好我正在使用星级评分选项，表格提交使用angularjs，如下面的jsfiddle

<http://jsfiddle.net/manishpatil/2fahpk7s/>

一切正常。

但我想在提交表格后将星级评定重置为默认值。有谁能帮我实现这个目标？

请参考我的代码我如何实施此星级评分

HTML：

Controller:

function socialPostCtrl(socialPostService, userPersistenceService, $location,        $sce) {
        var socialPostVM = this;

    socialPostVM.maxRating = 5;

    socialPostVM.clickstar = function (param) {
        socialPostVM.rating = param ;
    };


//submit post function

socialPostVM.addpost = function () {

angular.element(document.getElementById('addPostBtn'))[0].disabled = true;
            var result = socialPostService.addpost(socialPostVM.loggedUserDetails.UserId, socialPostVM.takeawayGuid, socialPostVM.newpost, socialPostVM.attachment, socialPostVM.rating).then(function (response) {
                if (response.Success) {
                    var newpost = {};
                    newpost.postid = response.SocialPost.SocialPostId;
                    newpost.postGuid = response.SocialPost.SocialPostGuid;
                    newpost.profilepic = "";
                    newpost.postby = response.SocialPost.PostUser;
                    newpost.postbyid = response.SocialPost.UserId;
                    newpost.poston = response.SocialPost.PostDate;
                    newpost.posttext = response.SocialPost.PostContent;
                    newpost.hasliked = response.SocialPost.HasLiked
                    newpost.totallikes = 0;
                    newpost.comments = [];
                    newpost.totalcomments = 0;
                    newpost.showcommentbox = false;
                    newpost.candeletepost = function () { return true; }
                    newpost.hasAttachment = response.SocialPost.HaveMedia;
                    if (response.SocialPost.HaveMedia) {

                    newpost.postattachment = $sce.trustAsResourceUrl(response.SocialPost.PostMedia.MediaFileName);
                }
                newpost.rating = socialPostVM.rating / socialPostVM.maxRating * 100;
                socialPostVM.socialposts.splice(0, 0, newpost);
            }
        }).finally(function () {
            socialPostVM.attachment = [];
            angular.element(document.getElementById('addPostBtn'))[0].disabled = false;                
            angular.element(document.getElementById('posttext'))[0].value = "";
            socialPostVM.filelist = [];               
        });
    };


Directive:

angular.module("test").directive('starRating', function () {
    return {
        restrict: 'E',
        scope: {
            rating: '=',
            maxRating: '@',
            readOnly: '@',
            click: "&"
        },

    template: "<div style='display: inline-block; margin: 0px; padding: 0px; cursor:pointer;' ng-repeat='idx in maxRatings track by $index'> \
                <img ng-src='{{((hoverValue + _rating) <= $index) && \"/images/star-empty-lg.png\" || \"/images/star-fill-lg.png\"}}' \
                ng-Click='isolatedClick($index + 1)' \
                ng-mouseenter='isolatedMouseHover($index + 1)' \
                ng-mouseleave='isolatedMouseLeave($index + 1)'></img> \
        </div>",
    compile: function (element, attrs) {
        if (!attrs.maxRating || (Number(attrs.maxRating) <= 0)) {
            attrs.maxRating = '5';
        };
    },       
    controller: function ($scope, $element, $attrs) {
        $scope.maxRatings = [];

        for (var i = 1; i <= $scope.maxRating; i++) {
            $scope.maxRatings.push({});
        };
        $scope._rating = $scope.rating;

        $scope.isolatedClick = function (param) {
            if ($scope.readOnly == 'true') return;

            $scope.rating = $scope._rating = param;             
            $scope.click({
                param: param
            });

        };
    }
}

}）;

由于

Answer 1

你需要更多信息。

在您要求提交的功能上，您需要将值重置为默认值。

$scope.submit = function(data){
//do something with data
//reset values back to defualt
$scope.starRating1 = 4;
$scope.starRating2 = 5;
$scope.starRating3 = 2;
$scope.hoverRating1 = $scope.hoverRating2 = $scope.hoverRating3 = 0;
};

在angularjs中提交后重置星级

1 个答案: