javascript - Wiring up a view model in NativeScript -

i'm starting learn nativescript. part of endeavor, need figure out how wire-up view model. i've reviewed examples. feel i'm close. however, off. @ same time, cannot seem figure out how see if there errors in app. currently, have:

login.xml

<page xmlns="http://www.nativescript.org/tns.xsd" loaded="pageloaded">   <scrollview>     <gridlayout columns="*, *" rows="auto, auto, auto, auto, auto, auto">       <label text="username" row="0" col="0" class="label" colspan="2" />       <border borderwidth="1" bordercolor="#000" row="1" col="0" colspan="2">         <textfield text="{{ username }}" hint="username" />       </border>        <label text="password" row="2"  col="0" class="label" colspan="2" />       <border borderwidth="1" bordercolor="#000" row="3" col="0" colspan="2">         <textfield text="{{ password }}" hint="password" secure="true" />             </border>        <button text="login" tap="loginbutton_tap" row="4" col="0" />       <button text="sign up" tap="signupbutton_tap" row="4" col="1" />        <label text="hello" row="5" col="0" />       <label text="{{ username }}" row="5" col="1" />     </gridlayout>   </scrollview> </page> 

login.xml.js

var viewmodel = require('./login-vm');  var viewmodel = new loginviewmodel(); function pageloaded(args) {   var page = args.object;   viewmodel.set("username", "testing");   page.bindingcontext = viewmodel; } exports.pageloaded = pageloaded;  function loginbutton_tap(args) {} exports.loginbutton_tap = loginbutton_tap;  function signupbutton_tap(args) {} exports.signupbutton_tap = signupbutton_tap; 

login-vm.js

var observable = require("data/observable"); var http = require("http");  function loginviewmodel() {} loginviewmodel.prototype = new observable.observable(); module.exports = loginviewmodel; 

as type in username field, expecting able see username in field. however, isn't happening. thought had two-way binding setup. i'd show username in "alert" window when user clicks login know i've wired view model properly. either way, not working.

what doing wrong?

to see value of input username in label below , nativescript's two-way databinding work in code posted, there few things need do:

1. login-xml.js --- rename login-xml.js login.js. nativescript runtime looks corresponding js file same name (login.js) xml file (login.xml)

2. login-vm.js --- change line module.exports = loginviewmodel; module.exports = new loginviewmodel();. facilitates instantiation of loginviewmodel in login.js.

3. login.js --- remove line var viewmodel = new loginviewmodel();. first line, var viewmodel = require('./login-vm'); instantiates loginviewmodel variable viewmodel.

i've tested code. check out , see happens.

also: going forward, might better put event handlers loginbutton_tap , signupbutton_tap methods in loginviewmodel.