Clicked --> Set with Value "{myObservable}" fails?

I have a button and a textview as below:


<TextView ux:Name="tv1" Value="{timelineProgress}" TextColor="#fff" Width="50" Height="20" Alignment="TopLeft"/>

<MyButton ux:Name="btnStart" Text="START" Width="100" Height="100">
		<Clicked>
			<Set tv1.Value="{timelineProgress}" />
		</Clicked>
	</MyButton>

and the timelineProgress is an Observable:

var timelineProgress = Observable(function()
    	{
			return "Test 1";
		});

module.exports = {
		    timelineProgress : timelineProgress
		};

When I first start the app, I see:

file

but when I press the button, I get this:

file

Why? Shouldnt it still stay “Test 1”?

So, if Im guessing correctly:

The Set updates the “Value”, and the Value points to the observable, and sets it to the string
“{timelineProgress}”
instead of updating it?

How do I reference an observable then? Lets say I have another observable, o2, that I want the tv1 to display? How do I do that in a click event?

From reading your code I think you would rather implement the behavior in JS.

For example:


<JavaScript>
	var timelineProgress = Observable();

	var start = function() {
		// Update timelineProgress here
	};

	module.exports = {
		timelineProgress:timelineProgress,
		start:start
	}

</JavaScript>

<TextView ux:Name="tv1" Value="{timelineProgress}" TextColor="#fff" Width="50" Height="20" Alignment="TopLeft"/>
<MyButton ux:Name="btnStart" Text="START" Width="100" Height="100" Clicked="{start}">