Угловая - Firebase - Повторение DIV ng-repeat дублирование новых строк

Question

При запуске проблемы, когда у меня есть повторяющаяся DIV на моей странице, но я получаю дубликаты при добавлении новых строк. Так, например, если у меня есть строки R и A и Row B, а затем я нажимаю «Добавить», чтобы добавить новую строку, мне бы хотелось увидеть три строки. Однако я получаю 5 строк: Row A, Row B, затем Row A, Row B и новый Row C.

Страница инициализируется в порядке, отображает только 3 строки, но что я делаю неправильно с помощью «Добавить «из новых строк ... Кажется, это не освежает, как хотелось бы?

Любая помощь будет замечательной! Спасибо!

Мой нг-повтор выглядит следующим образом:

<div ng-repeat="infant in Infants" class="list card"> 
    <h2>{{infant.name}} - {{infant.ID}}</h2> 
    <a class="item item-icon-left assertive" href="#"> <i class="icon ion-ios-analytics"></i> Last measurement 188mm/190mm (size 5.5) </a> 
</div> 

Инициализация из младенцев выше достигается с помощью глобального массива:

$scope.Infants = []; 

... 

    if (firebaseUser) { 
     //set the user and infant list variables 
     $log.log("Signed in as:", firebaseUser.uid); 
     var usersRef = firebase.database().ref('users'); 
     loggedInUser = usersRef.child(firebaseUser.uid); 
     loggedInUser.on('value', snapshot => { 
      $log.log("UserDetails:", snapshot.val()); 
     }); 
     InfantList = loggedInUser.child('infantList'); 
     InfantList.on('value', snapshot => { 
      $log.log("InfantDetails:", snapshot.val()); 
      angular.forEach(snapshot.val(), function (value, key) { 
       $log.log("val", value); 
       $log.log("key", key); 
       $scope.Infants.push(value); 
      }); 
     }); 
    }  

Тогда вызов функции, когда «» Добавить» нажатие кнопки выглядит следующим образом:

$scope.AddProfile = function() { 
    // get the firebase location 
    var newInfantRef = firebase.database().ref('/users/' + firebaseUser.uid + '/infantList/'); 
    // create the element 
    var newRef = newInfantRef.push(); 
    //add attributes 
    var newItem = { 
     riskLevel: '1.0' 
     , ID: newRef.key 
     , name: "Reggie" 
     , gender: "M" 
     , DOB: "2015-02-01" 
    }; 
    // Write the new infant. 
    var newInfant = {}; 
    newInfant['/' + newRef.key + '/'] = newItem; 
    newInfantRef.update(newInfant); 
} 

Answer 1

В вас r InfantList.on() вы возвращаете все значения в массив при добавлении нового значения.

Чтобы решить эту попытку:

InfantList.on('child_added', snapshot => { 
      ...your things... 
    } 

Это только нажать новое значение в массив, когда добавляется новое значение.