Two Objects arrays and concat - arrays

i have two arrays that are both connected to a scope (http get etc.):
$scope.allShops
that hold all the shop details and
$scope.allCds
that hold all the cd's
both work fine and the Ng-Repeat gives me all the output (individually) i need, i however would like to build a search that allows me to search on the cd name and on the shop name from the same search field (using a label to mention if its a shop or a cd to avoid confusion). So i came up with this:
$scope.allShops = [];
$scope.allCds = [];
var jointData1 = '';
var jointData2 = '';
var SearchAll = '';
var jointData1 = $scope.allShops;
console.info(jointData1);
var jointData2 = $scope.allCds;
console.info(jointData2);
var searchAll = jointData1.concat(jointData2);
console.info(searchAll)
But all the logs are empty, if i place the log inside the succes.array function it shows me the data object but placing the log with the scope outside give me nothing. How do i get the data outside the array function and able to concat the two scope?

Your console.info calls will be empty because the $http service hasn't got the data back yet.
You'd have to do this after the data is returned by using a promise (.then())

Just try this
function merge_options(obj1,obj2){
var obj3 = {};
for (var attrname1 in obj1) {
obj3[attrname1] = obj1[attrname1];
}
for (var attrname2 in obj2) { obj3[attrname2] = obj2[attrname2]; }
return obj3;
}
merge_options(obj1,obj2);

Related

How to stop original list from updating when cloned list is updated

I want to stop self.lineDetails from being updated when I update self.modifiedLineDetails.
self.modifiedLineDetails = [];
angular.forEach(self.lineDetails, function (value1, index1) {
var lineDetail = self.lineDetails[index1];
self.modifiedLineDetails.push(lineDetail)
});
console.log(self.lineDetails)
angular.forEach(self.modifiedLineDetails, function (value10, index10) {
var modifiedLineDetail = self.modifiedLineDetails[index10];
if (modifiedLineDetail.SelectedCustomers.length > 0) {
modifiedLineDetail.SelectedCustomers = 1;
} else {
modifiedLineDetail.SelectedCustomers = 0
}
});
console.log(self.modifiedLineDetails)
Previously I just assigned it like this self.modifiedLineDetails = self.lineDetails then I updated self.modifiedLineDetails but it wasn't working so I tried pushing it per line but self.lineDetails keeps updating.
You should clone an array and then modify your new array, one way to do this is using
spread operation ...
Here is the example of it:
var initialarray = [1,2,3,4];
var modification = [...initialarray];
modification.push(5);
console.log(initialarray);
console.log(modification);
Since the problem seems to be occurring because I was using angular. I researched and found angular.copy which creates a deep copy. The code below worked for me.
self.modifiedLineDetails = angular.copy(self.lineDetails);

get back the last updated data from local storage

i want to retrieve my last updated value from local storage.
my code is:
$scope.saved = localStorage.getItem('ids');
$scope.ids = JSON.parse($scope.saved);
localStorage.setItem('ids', JSON.stringify($scope.ids));
console.log($scope.ids)
$scope.LogIn = function() {
if($scope.id=='1'){
$state.go('app.playlists');
}
$scope.ids = [];
$scope.ids.push({text:$scope.id});
localStorage.setItem('ids', JSON.stringify($scope.ids));
};
using this code i am not getting the value in console instead getting 'undefined'
you can use $scope.ids.length-1 to get the last index of the array
$scope.saved = localStorage.getItem('ids');
$scope.ids = JSON.parse($scope.saved);
console.log($scope.ids[$scope.ids.length-1])

passing objects in Angular

I know that passing objects in Angular is the same as passing objects in vanillaJs, what's stumping me is why my model is not being updated.
I have bins that contain packages. Given a packageId, I need to find the bin it's in, and remove the package from it.
vm.Bins = []; // bins of packages
vm.debinPackage = function (packageId) {
var bin = vm.getBin(packageId);
var packagge = vm.getPackage(packageId, bin.Packages);
vm.removePackageFromBin(packagge, bin);
};
vm.getBin = function (binId){
return $filter('filter')(vm.Bins, function(bin, index) {
return bin.Id == binId;
})[0];
};
vm.getPackage = function (packageId, packages) {
return $filter('filter')(packages, function(packageItem, index) {
return packageItem.Id == packageId;
})[0];
};
vm.removePackageFromBin = function (packagge, bin) {
bin = $filter('filter')(bin.Packages, function(packageItem, index) {
return packageItem.Id != packagge.Id;
});
};
.
<button ng-click="adminManifestVm.debinPackage(packageId)"></button>
{{ adminManifestVm.Bins }}
So, vm.Bins in my controller, and consequently adminManifestVm.Bins in my view don't update to reflect the package that's been removed from the bin.
i.e. this line:
vm.removePackageFromBin(packagge, bin);
does not actually result in an updated vm.Bins object.
I think the problem is that, when I get the bin object I use var as a holder:
var bin = vm.getBin(packageId);
and that it is somehow detached from my vm.Bins object.
but I can't figure out how to manipulate the actual object in vm.Bins.
I tried operating on the object directly, rather than through the var
vm.debinPackage = function (packageId) {
var binId = vm.getBinIdWithPackage(packageId);
var packagge = vm.getPackage(packageId, vm.getBin(binId).Packages);
vm.removePackageFromBin(packagge, vm.getBin(binId));
};
but not only does that not work, it starts to make my code unreadable.
How do I ensure that the bin object I am operating on is the one that's in vm.Bin, as opposed to some copy of it?
Have you tried using splice to remove the item from the array instead of reassigning the array with the filtered list?
vm.removePackageFromBin = function (package, bin) {
var idx = bin.indexOf(package);
bin.splice(idx, 1);
};

Angularjs: Assigning Array within object

I am having an issue with losing data within an array when i try to assign it to a new array.
My object im using is as follows:
$scope.shops = [
{
name: "Kroger",
items: [ { itemName: "Chips"} ]
}
];
This is the code for the functions im using, it may be a callback issue? or something? Im losing the items info for the shop.
$scope.addItem = function(newItem, newShop){
var x = findShop(newShop);
x.items.push(newItem);
$scope.shops.push(x);
};
findShop = function(shopTag){
var old = angular.copy($scope.shops);
var tar = {
name: shopTag,
items: []
};
$scope.shops = [];
angular.forEach(old, function(shop, key){
if(shop.name === shopTag) {
tar.items = angular.copy(shop.items);
}
else {
$scope.shops.push(shop);
}
});
return tar;
};
the goal is to have the findShop function return a shop with the correct name, with empty items if there wasnt a shop previously, or with items full of the items if the shop was already created. then the addItem will push the item into the shop.items array and push the shop into the $scope
Any help is greatly appreciated!!!
You are right , it is this line which is causing the problem ,
tar.items = shop.items;
Try using it like this ,
tar.items = angular.copy(shop.items);
var old = $scope.shops; // old and $scope.shops point to the same place
..........
$scope.shops = []; // you assigned a new array that overrides the data
............
angular.forEach(old, function(shop, key){ // for each on an empty array????
If you dont want to point to the same reference use:
var copiedObject = angular.copy(objToCopy);
I guess the array is getting empty even before for loop.
Var old is reference to shops array, which you are making empty before foreach.. effectively making old empty...

Testing Angular Filter That Returns An Array with Jasmine

So, I'm having issues testing an angular filter that takes an array that has previously been sorted by a group property. It uses a flag property to indicate that the item is the first observation of that group, and then false for subsequent observations.
I'm doing this to have a category header in the UI with an ng-repeat directive.
When I test the filter, the output does not return the array with the flags unless I create new objects for the return array. This is a problem, because it causes an infinite loop when running in a webpage. The code works in the webpage when it just adds a flag property to the input object.
Is there some additional step I should be taking to simulate how angular handles filters so that it outputs the proper array?
This is what my test looks like right now.
describe('IsDifferentGroup', function() {
var list, itemOne, itemTwo, itemThree;
beforeEach(module("App.Filters"));
beforeEach(function () {
list = [];
itemOne = new ListItem();
itemTwo = new ListItem();
itemThree = new ListItem();
itemOne.group = "A";
itemTwo.group = "B";
itemThree.group = "C";
list.push(itemOne);
list.push(itemOne);
list.push(itemOne);
list.push(itemOne);
list.push(itemTwo);
list.push(itemThree);
list.push(itemThree);
list.push(itemThree);
list.push(itemThree);
list.push(itemThree);
});
it('should flag the items true that appear first on the list.', (inject(function (isDifferentGroupFilter) {
expect(list.length).toBe(10);
var result = isDifferentGroupFilter(list);
expect(result[0].isDifferentGroup).toBeTruthy();
expect(result[1].isDifferentGroup).toBeFalsy();
expect(result[4].isDifferentGroup).toBeTruthy();
expect(result[5].isDifferentGroup).toBeTruthy();
expect(result[6].isDifferentGroup).toBeFalsy();
expect(result[9].isDifferentGroup).toBeFalsy();
})));
});
And here is something like the code with the filter:
var IsDifferentGroup = (function () {
function IsDifferentGroup() {
return (function (list) {
var arrayToReturn = [];
var lastGroup = null;
for (var i = 0; i < list.length; i++) {
if (list[i].group != lastGroup) {
list[i].isDifferentGroup = true;
lastAisle = list[i].group;
} else {
list[i].isDifferentGroup = false;
}
arrayToReturn.push(list[i]);
}
return arrayToReturn;
});
}
return IsDifferentGroup;
})();
Thanks!
I figured out my issue.
When I was passing the items into the list, I just pushed a pointer to an item multiple times. I was not passing in unique objects so the flag was being overridden by the following flag in the array(I think). So, I just newed up 10 unique objects using a loop, pushed them into the array and ran it through the filter. And it worked.
I'm not entirely sure my analysis is correct about the override, because itemTwo was not being flagged as unique when it was the only itemTwo in the array. But the test is working as I would expect now so I'm going to stop investigating the issue.

Resources