Simple data binding using viewmodel


#1

This will probably sound like a completely stupid question, but what is the best practice to do simple data binding (one way) using a viewmodel? effectively make http request, get the data and simply update the UI? e.g

function HomeViewModel() {
    const viewModel = observableModule.fromObject({
        name: "can this be a function?",
        email: "how can these be updated?"
    });

    return viewModel;
}

Thanks!


#2

If you bind the name to a label in XML, that is just the simple one way binding. If you prefer to do it programmatically or for more information refer this docs.

<Label text="{{ name }}" />

#3

Thanks @manojdcoder, so how do I work with the ‘name’ property and manipulated it via code, given that it’s within the object (i.e observableModule.fromObject). Any example code that can help me?


#4

Did you go through the Observable docs?


#5

Yep, I see that I can use viewModel.set("name", "a name here); so is that the best practice instead of using the observableModule.fromObject? Thanks for the prompt reply!


#6

.fromObject is just for convenience, while creating an Observable with bunch of properties. After creation if you want to change any, use .set.


#7

Great, thanks @manojdcoder