I'm currently diving into Angular and I decided to tackle angular.copy with a simple example. My goal is to create an Object using a Service, and then create a new Object that only contains certain elements from the original Object.
Check out the full code example: HERE
This is how the "Data" Object looks like in the Service:
return {
name: "hello",
toys: ["asd", "lol"],
food: ["apple"],
phones: ["samsung", "lg", "iphone"]
};
In the Controller, I use angular.copy to duplicate the Object, create a new one, and add only specific elements from the original Object:
$scope.oldData = angular.copy(Data);
$scope.newData = {};
$scope.newData.name = oldData.name;
$scope.newData.toys = oldData.toys;
$scope.newData.phones = oldData.phones;
My expectation was to display just three elements for the user: the name, the toys array, and the phones array.
<h1>{{newData.name}}</h1>
<h1>Toys:</h1>
<ul>
<li ng-repeat="toy in newData.toys">{{ toy }}</li>
</ul>
<h1>Phones:</h1>
<ul>
<li ng-repeat="phone in newData.phones">{{ phone }}</li>
</ul>
However, it's not working as expected. Can anyone point me in the right direction on what I might be doing wrong?