Was ist der Unterschied zwischen main-page.js und main-view.model.js bei der Entwicklung von nativen Apps über Telerik App Builder

Question

Wie ändere ich den Text des xml-basierten TextFields über main-page.js? Ich verwende this.set("message", getMessage(this.counter));, um die Werte über main-view-model.js zu ändern. Aber dieses Szenario funktioniert nicht, wenn ich es in main-page.js versuche. Wie macht man das? :-) Und ich brauche eine Erklärung zu meiner Hauptfrage. Danke im Voraus.

Answer 1

Ich nehme an, Sie sprechen über die "Hallo Welt" NativeScript-Anwendung, die here gefunden werden kann. Der Unterschied ist, dass main-page.js der "Code hinter" der main-page.xml ist (beachten Sie, dass die Namenskonvention wichtig ist, damit {N} die Übereinstimmung herstellt) und die Hauptansicht-model.js eine separate Datei ist, die zugewiesen wurde als bindingContext auf der Seite des Haupt page.xml in seiner navigatingTo Veranstaltung, wie Sie können here sehen:

function onNavigatingTo(args) { 
    /* 
    This gets a reference this page’s <Page> UI component. You can 
    view the API reference of the Page to see what’s available at 
    https://docs.nativescript.org/api-reference/classes/_ui_page_.page.html 
    */ 
    var page = args.object; 

    /* 
    A page’s bindingContext is an object that should be used to perform 
    data binding between XML markup and JavaScript code. Properties 
    on the bindingContext can be accessed using the {{ }} syntax in XML. 
    In this example, the {{ message }} and {{ onTap }} bindings are resolved 
    against the object returned by createViewModel(). 
    You can learn more about data binding in NativeScript at 
    https://docs.nativescript.org/core-concepts/data-binding. 
    */ 
    page.bindingContext = createViewModel(); 
} 

um den Text des Etiketts (Textview) des Haupt-page.xml in seinem zu ändern code hinter file könnte man das label über eine id bekommen (getViewById()example) oder direkt das bindingContext (dein 'ViewModel') verwenden:

var createViewModel = require("./main-view-model").createViewModel; 
var viewModel; 

function onNavigatingTo(args) { 
    var page = args.object; 
    viewModel = = createViewModel(); 
    page.bindingContext = viewModel; 
} 

// Example with event handler for a 'tap' event of a Button 
function onButtonTap(args) { 
    viewModel.set("message", "New message set via code behind"); 
}