Interface: DataProviderAddOperationEventDetail

Fields

(nullable) addBeforeKeys :K[]

Optional array of keys for items located after the items involved in the operation. They are relative to after the operation was completed and not the original array.If null and index not specified then insert at the end.

Since:

• 6.0.0

(nullable) afterKeys :Set<K>

Optional set of keys for items located after the items involved in the operation. They are relative to after the operation was completed and not the original array. If null and index not specified then insert at the end.

Deprecated:

Since	Description
6.0.0	Use addBeforeKeys instead. addBeforeKeys is an Array instead of a Set.

Since:

• 6.0.0

(nullable) data :D[]

Optional data of items involved in the operation

Since:

• 4.2.0

Inherited From:

• DataProviderOperationEventDetail#data

(nullable) indexes :number[]

Optional indexes of items involved in the operation. Indices are with respect to the DataProvider with only its implicit sort applied. Essentially, indices are the global indices (except for TreeDataProvider, please see the note below), not the indices with respect to whatever query (which might have its own sorting or filtering) fetched the items.

For 'add' operation the indexes are relative to after the operation was completed and not the original dataset.

For 'update' operation the indexes are relative to after the operation was completed and not the original dataset.

For 'remove' operation the indexes are relative to the original dataset.

Note: With respect to TreeDataProvider, the index is the index at the level where the mutation occurs. That is, the index of the node among its siblings.

Optimization can be achieved by specifying indexes for mutation events.

Since:

• 4.2.0

Inherited From:

• DataProviderOperationEventDetail#indexes

Examples

Example to illustrate indexes from array mutations

let data = [{ id: 1, name: 'Amy Bartlet', title: 'Vice President' },
            { id: 2, name: 'Annett Barnes', title: 'Individual  Contributer' },
            { id: 3, name: 'Bobby Fisher', title: 'Individual Contributer' }];
let observableArray = ko.observableArray(data);
let dataProvider = new ArrayDataProvider(ko.observableArray(data), { keyAttributes: 'id' });

let listener = function(event) {
 // Print DataProviderEventDetail
};

dataProvider.addEventListener("mutate", listener);

observableArray.push({ id: 4, name: 'John schully', title: 'Manager' });
// Then the DataProviderOperationEventDetail will have Indexes as [3]

observableArray.splice(2, 1, { id: 5, name: 'Scott Jhonson', title: 'President' });
// Then the DataProviderOperationEventDetail will have Indexes as [2]

Example to illustrate indexes with respect to ArrayTreeDataProvider

let dataArray = [{
                   title: "Amy Bartlet",
                   id: "100"
                 },
                 {
                   title: "Scott Fisher",
                   id: "101",
                   children: [{
                                title: "John Fisher",
                                id: "102"
                              },
                              {
                                title: "Bobby Fisher",
                                id: "103"
                              }]
                 },
                 {
                   title: "Annett Barnes",
                   id: "104"
                 }];

createObservableArrayTree(data: Array) {
  let array = [];
  let observableArray = ko.observableArray(array);
  for (let i = 0; i < data.length; i++) {
    let newItem = data[i];
    if (data[i].children) {
      newItem.children = this.createObservableArrayTree(data[i].children);
    }
    observableArray.push(newItem);
  }
  return observableArray;
}

let observableArrayTree = createObservableArrayTree(dataArray);
let dataProvider = new ArrayTreeDataProvider(observableArrayTree, { keyAttributes: 'id' });
dataProvider.addEventListener('mutate', ((event: CustomEvent) => {
  console.log(event.detail);
}) as EventListener);
let index = 1;

observableArrayTree()[1].children.splice(index, 1);

// Output will be // { 'add': null, 'remove' : { 'indexes': [1] }, 'update': null}
// Here the index 1 refers to the object with id '103'.

keys :Set<K>

keys of items involved in the operation

Since:

• 4.2.0

Inherited From:

• DataProviderOperationEventDetail#keys

(nullable) metadata :Array.<ItemMetadata.<K>>

Optional metadata of items involved in the operation

Since:

• 4.2.0

Inherited From:

• DataProviderOperationEventDetail#metadata

(nullable) parentKeys :K[]

Keys of parents for the items involved in the operation.

If this property is undefined, the items involved in the operation have no parent. This is the case for non-hierarchical DataProvider implementatons such as ArrayDataProvider.

If this property has a value, each entry in the array represents the parent key of the corresponding item. A parent key of null indicates that the item is at the root level. TreeDataProvider implementations should always set this property.

Since:

• 6.0.0

(nullable) transient :boolean

Optional transient attribute is used to signal component whether data is actually removed or it is just removed from view. Return true when data is just removed from view.

Since:

• 12.0.0

Inherited From:

• DataProviderOperationEventDetail#transient