Databind doesn't work with elements in Observables

Hey. It seems i don’t quite understand the principles of observables. Following examples:

What do i want to achieve: I use a list to show some contacts and if i press on one of them the detail view opens where i can edit it, but the firstname and the lastname has to be filled. So i recieve the contact in the details js per router.push(“details”, { contact: contact });

Details JS-File:

var Observable = require("FuseJS/Observable");
var params = this.Parameter;

var contact = { return });
var firstname = { return });

function logData(){
	console.log("firstname: " + firstname);
	console.log("lastname: " + contact.value.lastname);

module.exports = {
	firstname: firstname,
	contact: contact

I databind them in the .ux-File like (shortened) :

<TextView Value="{firstname}" />
<TextView Value="{contact.lastname} />

<Button Clicked="{logData} />

My contact has the values “firstname: Max” and “lastname: Mustermann”.

If i press the button the logs say Max Mustermann. So far so good. But if i change the data in the UI from Max Mustermann to Peter Parker
i get “Peter Mustermann” in the logs.

So why does databinding not work with contact.lastname?
For example if my contact has 100 elements do i really have to write a new variable for every element so i can databind them to the UI and change them?

Only the high-level export is actually the Observable. The lastname is just a field in the object. These are inherently one-way in data binding.

map is also only a one-way mapping. The modified value will not make it back to the original object (in some special cases it might, but that’s more of a leak than an intended effect). The upcoming release (QA channel) has mapTwoWay to do this correctly. For simple field selections the pickTwoWay is what you’d want.

exports.lastname = contact.pickTwoWay("lastname")
exports.firstname = contact.pickTwoWay("firstname")

You might have another problem though. The router paths are string only, the object will be JSON serialized and one-way only. To modify a contact you would normally pass an ID of that contact, and use JS lookup code to get at the actual contact object. Think of routes as URLs.

Okay, Thanks for the reply, but if i try to use

exports.lastname = contact.pickTwoWay("lastname")

the monitor says :

Error message: Uncaught TypeError: contact.pickTwoWay is not a function
File name: Pages/ContactDetailsPage/ContactDetails.js
Line number: 62
Source line: exports.firstname = contact.pickTwoWay("lastname");

Also i can’t find any documentation or anything about pickTwoWay

pickTwoWay is in the pending QA release, not in the current release. The docs should be updated when it is released.

Fuse 0.33 is now released, and the docs for pickTwoWay can be found here