Getting object form ObservableArray in Nativescript

Question

I have a service class that has a array of quests like so:

import { ObservableArray, ChangedData } from 'tns-core-modules/data/observable-array/observable-array';

quests: ObservableArray<Quest>;

I can push quests into the array like this:

let quest = new Quest(data.key, data.value["name"], data.value["description");
this.quests.push(quest);

In another class I subscribe to change events of that array:

this.myService.quests.on(ObservableArray.changeEvent,(args:ChangedData<Quest>) => {
    console.log(args.object);
    let quest: Quest = args.object; // can not cast to quest
});

In the log I can see that my data is inside the ChangeData. But I horribly fail to cast that back to my object.

How can I achieve that?

Thanks

try the above and remove the typing from (args:ChangedData<Quest>) => make it (args) => — Idrees Khan
– Idrees Khan, Commented Aug 28, 2018 at 9:13
args if of type EventData its object property is of type element which raised the event. So you can't grab the Quest from its object. So you will be only notified by change detection. You can see this here docs.nativescript.org/core-concepts/events — Idrees Khan
– Idrees Khan, Commented Aug 28, 2018 at 9:24

Idrees Khan · Accepted Answer · 2018-08-28 09:53:00Z

3

i found a solution for you here. The problem is the typings. It doesn't show the properties that you need. So just make it of type any Essentially you need to do the following:

this.myService.quests.on(ObservableArray.changeEvent, (args: any) => {
  console.log(args.index);
  //the item which was added
  console.log(this.myService.quests.getItem(args.index));
  //now you can cast it
  let quest = <Quest>this.myService.quests.getItem(args.index);
  console.log(args.action); // Action (In this case "add")
});

When i tried to add a test object, i got this. Notice the index property. Using index you will get the newly added property.

this.myService.quests.push({ name: 'test1' });
this.myService.quests.push({ name: 'test2' });

And here was the output:

JS: 0 //this is index
JS: {
JS:   "name": "test1"
JS: }
JS: add //this is the action
JS: 1
JS: {
JS:   "name": "test2"
JS: }
JS: add

edited Aug 28, 2018 at 9:53

answered Aug 28, 2018 at 9:46

Idrees Khan

7,76218 gold badges65 silver badges112 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

NFC.cool Over a year ago

Thank you very much for your effort, I'll try this later!

Idrees Khan Over a year ago

@NicoS.glad it helped

Collectives™ on Stack Overflow

Getting object form ObservableArray in Nativescript

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related