The problem that I'm facing is that I have a ng-repeat and when I delete an item by clicking a button with a function associated to delete items in array the ng-repeat not shows properly the actual array.
The array looks like:
['stuff', 'stuff', 'stuff', ....]
What shows ng-repeat when I delete an item is the array without the last position although I deleted the first position. When I perform a console.log the array looks correct, the first position or x position was removed.
The problem was the:
track by $index
Due to some duplicate images in the proofs I've been doing. I removed it and it works as expected.
I was having this issue, I eventually narrowed it down to having something to do with the angular not being notified that something changed. To work around this, try using $apply. So something like this:
$rootScope.$apply(function() {
// remove the item from the array
})
long answer: https://github.com/angular/angular.js/wiki/Understanding-Scopes
short answer, switch your array to be:
[{label:'stuff'},...]
Related
I have these 3 dimensional arrays :
I then try to add a new row to the 2nd dimension using:
drawTable[1].push([0,0,0,0,0,0])
and the array updates to:
I did not expect drawTable[0] to be affected, but looks like it gets a row to, perhaps to keep it "square"?
I then run the following code:
drawTable[1][1]=[1,1,1,1,1,1].
I would expect this to only change one line of 0's, but it seems to change it in drawTable[0] and drawTable1 for some reason.
Can anyone explain this behavior to me?
schteppe was correct. I used drawTable.push(drawTable[0]) to create the second element of the drawTable array. Apparently that makes them mutually dependent?
I changed to:
drawTable[1]=drawTable[0].slice(0,drawTable[0].length)
and the problem went away.
How can I use more than one value to filter a list using the filterBy function?
My scenario is - I have a list of consoles which I want to filter based on the console_id.
Unfortunately, I don't have control over the JSON so each consoles has a different ID. I would like to loop through the Console IDs within the nested assignedConsole JSON and then filter through the root assignedConsole JSON.
I can get the console ID of the first object and place it into the filter but I don't know how I can use two values
I have created a emberjs bin to demonstrate my problem: http://emberjs.jsbin.com/kojute/2/
After some clarification from my previous answer, I realized you want to filter by console instead of filtering the assignedConsole values. My suggestion is to add a selectedConsole property on the controller, and display the array of assignedConsoles for the selected console.
Working JSBin: http://jsbin.com/nuroyuvuta/9
EDIT: See my other answer for the working solution!
I would suggest creating a computed property on your model or your controller that flattens that nested structure for you:
allConsoles: function() {
return this.get('consoles')
.mapProperty('assignedConsoles').reduce(function(a, b) {
return a.concat(b);
})
.uniq();
}.property('consoles.#each')
This will first get all of the items from the consoles property, then map all of their assignedConsoles to an intermediate value, which is then reduced by adding all the assignedConsoles together. The final uniq() call just removes any duplicates found in the array.
I am trying to replace an item in ngGrid with a different item. Splicing a single item works. Using splice to insert an item:
$scope.myData.splice(1, 0, object);
also works. However, splice(index,1,object) does not update grid. How can I show updates to myData on ngGrid? I have replicated the problem here.
I think that should work, I'd report it as a bug to the ng-grid team. If I change $watch to $watchCollection in their source it works fine (lines 3295, 3296 in ng-grid.js) (plnkr):
$scope.$on('$destroy', $scope.$parent.$watchCollection(options.data, dataWatcher));
$scope.$on('$destroy', $scope.$parent.$watchCollection(options.data + '.length', function() {
As an alternative you could use angular.copy to change the properties on the existing object instead of splicing the new object in:
angular.copy(obj, $scope.myData[1]);
So...I have this array:
val['an_element'][0]['another_element'][2]['text']
I want to get rid of the entire "2" node.
Now...I THOUGHT the way to do this would be:
delete val['an_element'][0]['another_element'][2];
BUT...it doesn't actually drop the element, but simply empties it out.
I also tried:
val['an_element'][0]['another_element'][2] = null;
...but that just resulted in my console log nearly bleeding it was so red with errors.
Basically, i want that [2] node to NO LONGER EXIST. Basically, I want it to NOT BE FOUND AT ALL.
What do I do??? And I know the ".splice" method will NOT actually modify the original array, so please don't suggest it. :)
The splice method will, in fact, modify the array. Just try:
val['an_element'][0]['another_element'].splice(2, 1);
From the docs:
Changes the content of an array, adding new elements while removing old elements.
...
If you specify a different number of elements to insert than the number you're removing, the array will have a different length at the end of the call.
So, the issue I'm having is I have an array in my controller $scope called $scope.calls and I can push in to that array just fine and have it update on the page. Simple stuff. What I want to do is to be able to delete from $scope.calls and have it reflect on the page like that. If you look at $scope.deleteCall(), it deletes it from the array fine but doesn't remove the elements from the page. Is there away to clear out those elements when the data is removed?
http://jsfiddle.net/kyct/6tcW8/75/
The problem was that you were not removing the item from an array really. The correct approach would be:
$scope.deleteCall = function (callIndex) {
$scope.calls.splice(callIndex, 1);
}
Here is a working jsFiddle: http://jsfiddle.net/UAPhn/