My webpage features a section where I showcase all the individuals stored in the database, referred to as the All Persons Page. Within this page, there are two primary options:
- Add New Person
- Delete Person (Any selected individual)
An issue arises when I navigate away from the page and return to the All Persons Page.
If I delete a person and then add a new one, the view will display both the newly added person and the deleted person.
In the controller, I populate an array with data retrieved from the DB.
$scope.persons_array = []
This data is displayed in the view using ng-repeat.
<div ng-repeat="(key, value) in persons_array)">
To add a person, a new ID is inserted into the array:
$scope.persons_array.push($scope.id[i])
To delete a person, the specified ID is removed from the array:
$scope.persons_array.splice(i,1);
Tests:
To investigate the problem, I implemented an setInterval function:
setInterval(function(){
console.log($scope.persons_array)
}, 5000)
While on the All Persons Page with an existing person added, the output was:
[Object { id=667, $$hashKey="object:71"}]
Upon navigating to another page and returning:
[Object { id=667, $$hashKey="object:71"}] //original
[Object { id=667, $$hashKey="object:220"}] //new
Adding a new person:
[Object { id=667, $$hashKey="object:71"}] //original
[Object { id=667, $$hashKey="object:220"}, Object { id=668, $$hashKey="object:227"}] //new
Deleting the recently added person:
[Object { id=667, $$hashKey="object:71"}] //original
[Object { id=667, $$hashKey="object:220"}, Object { id=668, $$hashKey="object:227"}] //new
Removing the person already present in the DB:
[] //original
[Object { id=667, $$hashKey="object:220"}, Object { id=668, $$hashKey="object:227"}] //new
Adding a new person once more:
[] //original
[Object { id=667, $$hashKey="object:220"},
Object { id=668, $$hashKey="object:227"},
Object { id=669, $$hashKey="object:235"}] //new
It seems that upon navigating to another page, Angular somehow duplicates the $scope.persons_array and subsequently stops updating the original array.