Copy of Observable/ not Updating on parent

How-to Discussions
1

Heey :smiley:
Is it possible to get a copy of an Observable?
If I do something like:

var parent = Observable ([{id: 1, name: "first"}, {id: 2, name: "second"}, {id: 3, name: "last"}]);
var wrapper = Observable();
for(var i=0; i<10;i++){
        var newObservable = Observable();
        newObservable .replaceAll(parent);
        wrapper.add(newObservable);
}

But if I change the value of one child in that wrapper, the value changes in each Observable…
Can anyone help or got an idea for a workaround?! :confused:

Thanks!

2

Hello there,

I am not sure what you are trying to achieve, if you can give more details.
But if you just need a mere copy of an observable, you can use expand, check this link
https://fuseopen.com/docs/fusejs/observable-api.html#expand-func

Hope that helps.

3

Thanks for your reply! :slight_smile:
I saw this, but it does not fit, or am using this not correct…

Usercase:
I got different cards with questions. The User now can give to each question an answer (checkbox values). These answers are stored in the child Observable (each question got one Observable).

The Problem now is ,when I give for the first one an answer, all other answers are also set :confused:
I need the parent Observable, because the answers are also dynamically generated.

I dont want to create manually Observables for each, because I do a fetch and the numbers of questions ist different…

I hope you know what I mean :smiley:
So I want a copy of an Observable (of the parent) but not as a Subscriber to this, just as a complete new Observable.

Thaanks x) (=

4

My understanding is that you want to keep track of the selected answer for each question, is that so? Here is my try:

<JavaScript>
    var Observable = require("FuseJS/Observable");
    var questions = [];

    for(var i = 0; i < 5; i++) {
      var question = { 
        qtext : "question #" + i, 
        answers : [],
        selectedAnswer : Observable()
      };
      for(var j = 0; j < 3; j++) {
        question.answers.push({ 
          id: j, 
          atext : "answer #" + j + " for question #" + i, 
          refQuestion : question.selectedAnswer 
        });
      }
     
      questions.push(question);
    }
     var selectAnswer = function(args) {
        args.data.refQuestion.value = args.data.id;
      }
    module.exports = {
      questions : questions,
      selectAnswer : selectAnswer
    }
  </JavaScript>
  <StackPanel>
    <Each Items="{questions}">
      <Text Value="{qtext}" />
      <Each Items="{answers}">
        <Text Value="{atext}" Clicked="{selectAnswer}" />
      </Each>
      <Text Value="Selected answer is {selectedAnswer}" />
    </Each>
  </StackPanel>

I resolved it by keeping only the most relevant property for me to observe, which is the selected answer for each question, I added a nested reference to that parent observable property to play with. There is a possibility for cyclic dependency if you make the parent arrays observable also, but I don’t think you will need to change the questions and answers in your case.
I am not sure it’s the best solution, so if anyone can correct me or complete with further insights.

5

Great! Thank you for your Time and your example! :slight_smile:
But I dont get this fit for my project :confused:

to combine your example with my project:
I get in an earlier fetch an Observable with the complete Answers in the form:

Observable([{id: 123, name: “Answer One”, active: false}, {id: 345, name: “Answer Two”, active: false}, {id: 789, name: “Answer Three”, active: false}])

In your example I want to store this Observable in the “question” Array. And when I click in on an answer the value for “active” changes from false to true. But I need a copy of that answer Observable, not a reference to that.

If I do something like:

question.answers.replaceAll(answerObservableFromFetch);

all the answers with the same Id will be changed. Not only the one for for that one question.

Is there no way to copy that duplicate that Observable without beeing the same Subscriber? :confused:
:v::v::v:

6

how about using toArray() method as describe in https://fuseopen.com/docs/fusejs/observable-api.html#toarray

7

As Ichan said, have you tried toArray inside an onValueChanged subscription and make a new Observable out of it? That should do the “copy”

8

Have you tried using an array of Observables?

9

Sorry for the late reply :v::v:
Yes thats working for me! :slight_smile:

The only thing is, that I need to do it like this:

var newObservable = Observable();
newObservable.replaceAll(oldObservable.toArray());

And not like this:

var newObservable = Observable(oldObservable.toArray());

But its okay for me :smiley:

So thank you very much! (= (=