2016-12-18 9 views
0

Ich schreibe einen Internet-Shop mit Java auf der Serverseite und eckig auf dem Client. Ich bin auf ein Problem gestoßen, nachdem ich mit dem Kommentarbereich gearbeitet habe. Meine Kommentarliste wird nach dem zweiten Mal aktualisiert, wenn ich auf "Senden" klicke, mit dem zuvor geschriebenen Kommentar. Also, um meinen Kommentar zu sehen, muss ich zuerst klicken, um es an den Server zu senden, und zweitens, um das Kommentar-Array zu aktualisieren (aber nach dem zweiten Klick wird ein neuer Kommentar gesendet, aber nicht gerendert). Bitte helfen Sie, ich bin Neuling auf WinkelWinkelcode funktioniert nach dem zweiten Klick

var productApp = angular.module('productApp', []); 
productApp.controller('productCtrl', ['$scope', '$location', '$http', function ($scope, $location, $http) { 
    var url = $location.absUrl() + '/comments'; 
    $scope.comments = []; 
    function getAllComments() { 
    $http.get(url).then(function (response) { 
     $scope.comments = response.data; 
    }); 
    } 

    var sendComment = function() { 
    var comment = {'userName': 'danko', 'content': $scope.comment}; 
    $http.post(url, comment); 

    }; 
    $scope.send = function() { 
    sendComment(); 
    getAllComments(); 
    }; 
    getAllComments(); 
}]); 

Vorlage:

<ul class="media-list"> 
        <li class="media"> 
         <div ng-repeat="comment in comments" class="media"> 
          <a class="pull-left"> 
           <img class="media-object img-circle" src="/resources/img/user.png" 
            style="width: 64px; height: 64px;"> 
          </a> 
          <div class="media-body"> 
           <h4 class="media-heading">{{comment.userName}}</h4> 
            {{comment.content}} 
          </div> 
         </div> 
        </li> 
       <br> 
       <div class="input-group"> 
         <textarea class="form-control custom-control" ng-model="comment" placeholder="Leave feedback" rows="3" 
            style="resize:none"></textarea> 
        <span class="input-group-addon btn btn-success" ng-click="send()">Send</span> 
       </div> 
      </ul> 
+0

Werfen Sie einen Blick auf die Reaktion der alle Kommentare api erhalten, in dev Tools/Netzwerk Registerkarte –

Antwort

6

Scheint, wie Sie diese zwei Funktionen parallel ausgeführt werden:

$scope.send = function() { 
    sendComment(); 
    getAllComments(); 
}; 

Basierend auf Ihre Kommentare, Sie die Nachrichten erhalten, bevor die neue Nachricht gesendet (gespeichert) wird. Sie sollten ein Versprechen, dieses Problem zu beheben:

$scope.send = function() { 
    sendComment(); 
}; 
var sendComment = function() { 
    var comment = {'userName': 'danko', 'content': $scope.comment}; 
    $http.post(url, comment).then(function(){   
     getAllComments(); 
    }) 

}; 
Verwandte Themen