La vista Angular.js non si aggiorna quando l'array $ scope annidato viene aggiornato

Question

Sto tentando di effettuare l'aggiornamento di una vista angular.js quando si aggiunge un commento. Il mio codice è il seguente:

<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> 

il campo di applicazione è aggiornato immettere:

$('.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); 
    } 
}); 

debug $ scope.currentItem mostra che il commento è stato aggiunto ad essa, tuttavia la vista non mostra la nuovo commento Sospetto che il $ scope sia guardato solo al suo primo livello e che questo è il motivo per cui la vista non si aggiorna. è questo il caso? Se sì, come posso ripararlo?

SOLUZIONE: Come Ajay ha suggerito nella sua risposta qui sotto ho avvolto la spinta array in funzione si applicano in questo modo:.

var el=$(this); 
$scope.$apply(function() { 
    $scope.currentChallenge.comments.push({ 
     "user": $scope.currentUser, 
     "message": el.val() 
    }); 
}); 

Answer 1

modificare il codice per avvolgere dentro portata $ applicare perché si sta modificando la proprietà al di fuori l'angolo angolare si deve usare scope.$apply() per guardare i valori

Answer 2

Ho dovuto inserire il mio modulo all'interno dello stesso controller div come il ng-repeat. Ho avuto due controller div separati.

Answer 3

Utilizzare $ scope. $ Parent.arrayObjet per modificare le variabili padre anziché $ scope.arryaObject. Ha funzionato nel mio caso.

Answer 4

<div class="col-sm-12 col-lg-12"> 
      <div class="outer-container"> 
       <div class="inner-container"> 
        <div class="table-header"> 
         <form id="teamForm" name="teamForm"> 
          <table class="table table-bordered"> 
           <thead> 

           <!-- Grid header --> 
           <tbody data-ng-if="(allTeamMembers.length==0)"> 
            <tr> 
             <td class="text-center height_33_p" colspan="15"> {{noResultFound}} </td> 
            </tr> 
           </tbody> 
           <!-- Existing team member --> 

           <tbody data-ng-repeat="tm in teammemberDetailsArryobject|orderBy:orderByField:reverseSort" data-ng-form="innerForm_$index" data-ng-class="{'ng-submitted':innerForm_$index.$submitted}"> 
            <tr></tr> 
            </tbody> 

Nel codice sto cancellando un record e aggiungere nuova riga di codice, ma tutte le righe vengono visualizzati nelle righe ng-repeat (compresi cancellato)