NativeScriptを学び始めています。その取り組みの一環として、ビュー モデルを接続する方法を理解する必要があります。例を確認しました。近くにいるような気がします。しかし、何かがずれています。同時に、アプリにエラーがあるかどうかを確認する方法がわかりません。現在、私は持っています:
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;
ユーザー名フィールドに入力すると、フィールドにユーザー名が表示されることを期待していました。しかし、それは起こっていません。双方向バインディングのセットアップがあると思いました。ユーザーがログインをクリックしたときに「アラート」ウィンドウにユーザー名を表示して、ビューモデルを適切に配線したことを確認したいと思います。いずれにせよ、それは機能していません。
私は何を間違っていますか?