Я пытаюсь сделать само обновление представления angular.js при добавлении комментария. Мой код выглядит следующим образом:
<div class="comment clearfix" data-ng-repeat="comment in currentItem.comments" data-ng-class="{bubble: $first}" data-ng-instant>
<div>
<p>
<span class="username">{{comment.user}}</span> {{comment.message}}
</p>
<p class="time">
10 minutes ago
</p>
</div>
</div>
<div class="comment reply">
<div class="row-fluid">
<div class="span1">
<img src="assets/img/samples/user2.jpg" alt="user2" />
</div>
<div class="span11">
<textarea class="input-block-level addComment" type="text" placeholder="Reply…"></textarea>
</div>
</div>
</div>
область обновления обновляется при вводе:
$('.addComment').keypress(function(e) {
if(e.which == 10 || e.which == 13) {
$scope.currentItem.comments.push({
"user": "user3",
"message": $(this).val()
});
console.debug("currentItem", $scope.currentItem);
}
});
отладка $scope.currentItem показывает, что комментарий добавлен к нему, однако в представлении не отображается новый комментарий. Я подозреваю, что $scope просматривается только на первом уровне и что поэтому представление не обновляется. что дело? Если да, то как я могу это исправить?
РЕШЕНИЕ: Как предложил Аджай в своем ответе ниже, я завернул массив, нажав на функцию apply, как это:
var el=$(this);
$scope.$apply(function () {
$scope.currentChallenge.comments.push({
"user": $scope.currentUser,
"message": el.val()
});
});