Conflict between listview pageloaded & onNavigatingTo


#1

I have a listview with a button that links to the view-model.js but to display the listview I have to declare pageloaded in map.js. whenever I click the button it errors in the emulator
stating:

binding.Context.locategym is not a function

here’s my code
map.js

const observableModule = require("data/observable");
const frameModule = require("ui/frame");
var pageData = new observableModule.Observable();
const MapViewModel = require("./map-view-model");

var myMapsArray = [
    {title:"Bldg 16 - Gymnasium", image:"~/images/map/gym.jpg", col: "0"},
    {title:"Bldg 16 - Gymnasium", image:"~/images/map/gy.jpg", col: "1"},
    {title:"Bldg 16 - Gymnasium", image:"~/images/map/gym.jpg", col: "0"},
    {title:"Bldg 16 - Gymnasium", image:"~/images/map/gym.jpg", col: "1"}
];

var myMaps = null;
pageData.set("myMapsArray", myMapsArray);

function pageLoaded(args) {
    var page = args.object;
    page.bindingContext = pageData;
    myMaps = page.getViewById("myMaps");
}
exports.pageLoaded = pageLoaded;

function onNavigatingTo(args) {

    if (args.isBackNavigation) {
       return;
    }

    const page = args.object;
    page.bindingContext = new MapViewModel();
}

function onHome() {
    frameModule.topmost().navigate("home/home-page");
}
function gymlocate(args) {
    button = args.object;
    const bindingContext = button.bindingContext

    bindingContext.locategym();
}

exports.onNavigatingTo = onNavigatingTo;
exports.onHome = onHome
exports.gymlocate = gymlocate

map-view-model.js

const observableModule = require("data/observable");

var Directions = require("nativescript-directions").Directions;
var directions = new Directions();

function MapViewModel() {
    const viewModel = observableModule.fromObject({

    	locategym : function() {

    		directions.navigate({
			  to: { // either pass in a single object or an Array (see the TypeScript example below)
			    address: "USTP Gymnasium, Cagayan de Oro, Misamis Oriental"
			  }
			  // for iOS-specific options, see the TypeScript example below.
			}).then(
			  function() {
			    console.log("Maps app launched.");
			  },
			  function(error) {
			    console.log(error);
			  }
			);

    	}

    });

    return viewModel;
}

module.exports = MapViewModel;

#2

What does your definition of locategym look like? Based on the error message you’re getting, it’s not defined as a function yet you’re trying to use it like one with this call: bindingContext.locategym().


#3

i’ve updated my thread pls take a look