Question

我刚刚开始使用Nativescript，我正在尝试创建一个GPS仪表板。这就是我所拥有的：

划线page.xml

<Page xmlns="http://schemas.nativescript.org/tns.xsd" navigatingTo="onNavigatingTo" class="page" actionBarHidden="true">  
    <Page.actionBar>
        <ActionBar title="Dashboard">
            <android>
                <NavigationButton icon="res://ic_menu" tap="showSlideout" ios.position="left"/>
            </android>
            <ios>
                <ActionItem icon="res://ic_menu" ios.position="left" tap="showSideDrawer" />
            </ios>
        </ActionBar>
    </Page.actionBar>


    <GridLayout columns="2*,auto,auto,2*" rows="150,*,60" style.backgroundColor="#182126">            
            <Image src="res://ic_speed" row="0" col="0"   class="speedIcon"></Image>
            <Label text="{{ mySpeed }}" row="0" col="0"   class="speedText"/>    

            <Image src="res://ic_duration" row="0" col="1" class="durIcon"></Image>
            <Label text="{{ myDuration }}" row="0" col="1"  class="durText"/>

            <Image src="res://ic_distance" row="0" col="2"   class="distIcon"></Image>
            <Label text="{{ myDistance }}" row="0" col="2"   class="distText" /> 

            <Image src="res://ic_altitude" row="0" col="4"   class="altIcon"></Image>
            <Label text="{{ myAltitude }}" row="0" col="4"   class="altText"/> 

            <!-- /* map will enter here 
            <StackLayout row="1">
                <map:MapboxView
                    accessToken="pk.eyJMzg1Njl5eSJ9.w2K2EUOZzxtCqqAARGBbZA"
                    mapStyle="light"
                    latitude="52.3702160"
                    longitude="4.8951680"
                    zoomLevel="3"
                    showUserLocation="true"
                    mapReady="onMapReady">
                </map:MapboxView>
            </StackLayout>
-->
            <Label text="Origin" row="3" col="0"  class="originText"/>
            <Label text="{{ originHeading }}" row="3" col="0"  class="originHead"/>
            <Label text="{{ originDistance + ' mi'}}" row="3" col="1"   class="originDist"/>
            <Label text="{{ originTime + ' min' }}" row="3" col="2"  class="originDur" />  
            <Button text="{{ butAction }}" row="3" col="5" tap="{{ onTapStart }}"/>
    </GridLayout>
</Page>

划线page.js

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

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

exports.onNavigatingTo = onNavigatingTo;

破折号 - 视图 - model.js

var Observable = require("data/observable").Observable;
var frames = require("ui/frame");
var dialogs = require("ui/dialogs");

// Get geo coordinates
var geolocation = require("nativescript-geolocation");
if (!geolocation.isEnabled()) {
        geolocation.enableLocationRequest();
}

//Showing just one variable as example to decrease the size of the code here
var myAltitude = "0";

//Gets current location when app starts
var geolocation = require("nativescript-geolocation");
if (!geolocation.isEnabled()) {
        geolocation.enableLocationRequest();
}
var location = geolocation.getCurrentLocation({desiredAccuracy: 3, updateDistance: 10, maximumAge: 20000, timeout: 20000}).
then(function(loc) {
    if (loc) {
        originLoc = loc;
        alert("Current location is: " + loc.latitude + ", "+loc.longitude);
    }
}, function(e){
    console.log("Error: " + e.message);
});

function createViewModel() {
    var viewModel = new Observable();
    viewModel.myAltitude = myAltitude;

    viewModel.onTapStart = function(args) {
        alert("Current altitude is: " + originLoc.altitude);
        viewModel.myAltitude = originLoc.altitude;
        myAltitude = originLoc.altitude;
        this.myAltitude = originLoc.altitude;
    }
return viewModel;
}

exports.createViewModel = createViewModel;

不幸的是，它没有更新myAltitude绑定（我已经尝试了3种方法而没有成功）。我有什么想法吗？

Answer 1

经过多次试验，我终于找到了更新仪表板的方法：

this.set("myAltitude",myAltitude)

Nativescript位置服务不更新我的仪表板

1 个答案: