DaveC426913 DaveC426913 - 2 years ago 427
AngularJS Question

deleting an angular object from an array - $$hashKey?

I have a dialogue that adds a Master Carton to an array of Master Cartons.

A repeater shows 1 or more Master Cartons:

<div ng-repeat="carton in dimensionsModalVm.masterCartons">
<div class="form-group">
<label class="control-label col-md-3">Length</label>
<div class="col-md-9">
<input name="length" min="0" max="999" class="form-control input-inline input-xs" type="number" placeholder="Enter Length" ng-model="carton.dimensions.length" required /> inches
<div class="form-group">
<label class="control-label col-md-3">Weight</label>
<div class="col-md-9">
<input name="weight" min="0" max="999" class="form-control input-inline input-xs" type="number" placeholder="Enter Weight" ng-model="carton.dimensions.weight" required /> pounds

<button class="btn btn-default" ng-click=" dimensionsModalVm.addMasterCarton()" type="button">Add another master carton</button>

My creation of the first MC on page init is called

function dimensionsModalInstanceController($http, $uibModal, $uibModalInstance, toastr, cart, masterCarton, CartObservable) {

vm.addMasterCarton = function () {
length: 0,
weight: 0

For what it's worth, dimensionsModalInstanceController is created within the previous modal's controller here - so dimensionsModalInstanceController is dimensionsModalVm:

function masterCartonModalInstanceController($uibModal, $uibModalInstance, cart) {
vm.yes = function(size) {
var modalInstance = $uibModal.open({
templateUrl: 'dimensionsModalContent',
controller: 'dimensionsModalInstanceController',
controllerAs: 'dimensionsModalVm',


To add another MC, the button simply calls vm.addMasterCarton.


Now I want to be able to delete a MC. I've added a [X] in the corner of each MC.

<div ng-repeat="carton in dimensionsModalVm.masterCartons">
<button class="btn btn-default pull-right" type="button" ng-click="dimensionsModalVm.deleteMasterCarton(this)">X</button>

vm.deleteMasterCarton = function (obj) {

My output is:

Object {length: 1, weight: 1, $$hashKey: "object:51"}


Object array
$$hashKey: "object:33",
length: 1,
weight: 1

$$hashKey: "object:51",
length: 1,
weight: 1

How do I tell it to delete the object from the array? I see matching $$hashKeys, but I'm not sure what to do with them.

I don't want to have to invent a unique ID to track them.

If I used track by index on my MC repeater, would they get out-of-place as I delete them?

This article:
How do I delete an item or object from an array using ng-click?

suggests this should work:

var index = vm.masterCartons.indexOf(obj);
vm.masterCartons.splice(index, 1);

Unfortunately, it does not delete the right one.

Answer Source

First of all. Using track by ... ($index, id, etc) is always good idea. You do not need to worry about track by and possible issues for your list. Second.





and try again with "index of"

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download