How to call function of view-model?


#1

Hello guys, I have a quick question
Here is my code:

view-model.js

const fetchModule = require('fetch');
const frameModule = require('ui/frame');
const observableModule = require('data/observable');


var Test  = (function (_super) {
    __extends(Test, _super);
    function Test(props, isItemVisible) {
        var _this = _super.call(this) || this;
        _this._id = props._id;
_this.isItemVisible = isItemVisible;
        return _this;
    }
    return Test;
}(observableModule.Observable));

  Test.prototype.toggleVisibility = function (args) {
        this.set("isItemVisible", !this.isItemVisible);
    };

function Users(user) {
 let viewModel = {};
 viewModel = new observableModule.fromObject({
        users: [],
    });

  viewModel.getUsers = function () {
            return fetchModule.fetch(`/users')
            .then(function (response) {
                return response.json();
            })
            .then()
            .then(function (data) {
           let list = [];
            list =  data.forEach(function (item, index) {
                          list[ind] = new Test(item, false);
              });
              viewModel.users = list;
                }
            })
            .catch(function () {
                // console.log("CONTACTS : Error while fetching userusers", err);
            });
        });
 return viewModel;
}

module.exports = Users;

js . file

let page;
function loaded(args) {

    page = args.object;
    page.bindingContext = UsersModel;
    UsersModel.getUsers()
        .then(function () {
        });
}

function editUser(args) {
 var user = args.view.bindingContext;
 // how to call toggleVisibility Method ???
}

module.exports = {
loaded,
editUser
}

xml file

<Page xmlns="http://schemas.nativescript.org/tns.xsd"
      xmlns:lv="nativescript-pro-ui/listview"
      loaded="loaded">
        <GridLayout row="1" col="0">
            <lv:RadListView id="listView"
                            row="1"
                            items="{{ users }}"
                            itemTap="editUser">
                <lv:RadListView.itemTemplate>
                    <GridLayout rows="auto" columns="*"  class="black" >
                        <Label col="0" class="m-y-auto" textWrap="true" text="Random User text" />
                    </GridLayout>
                </lv:RadListView.itemTemplate>
            </lv:RadListView>
    </GridLayout>
</Page>

I have view where i show Users, and I want when I tap on a ListView Item to call method of my class Test, that is called toggleVisibility but to do that when Item is tapped, how can I do that because, when I tap, with args.view.bindingContext i only get Item properties but no methods ???


#2

You will have to bind the function like you bind items.


#3

Yes but how could I do that, could you share some code example ???
I would like each item to have its own function that I could call ???


#4

Docs has everything you need.