How to set data with binding into child array


for example I have data like this:

what if I want to set the item2 only in data and not whole data.

I know ->> viewModel.set(‘data’, someData);
but is it possible to do something like this? viewModel.set(data.jsonArr[0].item2,“new value”);


If you’re using a ListView to display your array, then it may be that all you need to do is make your array changes and refresh the list view, with something like

listView = page.getViewById('myListView');


thanks, this is nice, but in my case i’m using accordion plugin and in accordion item I’ve got complex view with 2 textfields and more…

problem is: accordion requires items source, so i have items source and inside it textfield1 and textfield2 values to show default text when load, for example: "select date,
after load I have date picker and I want to set picked date to this textfield.


Can you help me here? @dlcole


add visibility to that field like this:

<Label text="whatever" visibility="{{streetnumberVisibility}}" />

and change streetnumberVisibility from view model depending on city picker selected index,
“visible” or “collapse”


Hi @Giorgius, I am using json metadata to construct the form. So I am not sure how and where to add

Label text=“whatever” visibility="{{streetnumberVisibility}}" />

Also, can you give me more insight of where to make changes in the view model. Here is my view model.ts file

import fs = require(“tns-core-modules/file-system”);
import observable = require(“tns-core-modules/data/observable”);

export class PersonViewModel extends observable.Observable {

constructor() {

    var documents = fs.knownFolders.currentApp();
    var jsonPersonFile = documents.getFile('person-model.json');
    var that = new WeakRef(this);
        .then(function (content) {
            try {
                var person = JSON.parse(content);
                that.get().set("person", person);
            } catch (err) {
                throw new Error('Could not parse JSON file');
        }, function (error) {
            throw new Error('Could not read JSON file');

    var jsonMetadataFile = documents.getFile('person-metadata.json');
        .then(function (content) {
            try {
                var metadata = JSON.parse(content);
                that.get().set("metadata", metadata);
            } catch (err) {
                throw new Error('Could not parse JSON file');
        }, function (error) {
            throw new Error('Could not read JSON file');



where is the streetnumber inside person-metdata?


didn’t quite get what you need but here is the json file named person-metadata.json, I am using.

“isReadOnly”: false,
“commitMode”: “Immediate”,
“validationMode”: “Immediate”,
“name”: “name”,
“displayName”: “Name”,
“index”: 0
“name”: “age”,
“displayName”: “Age”,
“index”: 1,
“editor”: “Number”
“name”: “email”,
“displayName”: “E-Mail”,
“index”: 2,
“editor”: “Email”
“name”: “city”,
“displayName”: “City”,
“index”: 3,
“editor”: “Picker”,
“valuesProvider”: [“New York”, “Washington”, “Los Angeles”]

  "name": "street",
  "displayName": "Street Name",
  "index": 4,
  "visibility": "false"
  "name": "streetNumber",
  "displayName": "Street Number",
  "index": 5,
  "editor": "Number"


As you can see I am using this json to build the form, and another json to populate it at the same time

The other json is person-model.json
Here it is,
“name”: “John”,
“age”: 23,
“email”: "",
“city”: “New York”,
“street”: “5th Avenue”,
“streetNumber”: 11


Here is my XML



<df:RadDataForm id=“myDataForm” source="{{ person }}" metadata="{{ metadata }}" />

Herei is my typescript file:

import viewModel = require("./person-model");
import dataFormModule = require(“nativescript-ui-dataform”);
import {EventData, Observable} from “data/observable”;
import {Page} from “ui/page”;

var dataform;

export function onPageLoaded(args) {
var page = args.object;
page.bindingContext = new viewModel.PersonViewModel();
dataform = page.getViewById(“myDataForm”);


@Giorgius Will it be possible to make the changes you suggested when using json file to build the UI dataform?


I’m sure it will be possible but unfortunatelly I’m not good at angular, I’m working on nativescript core


Oh I figured it out. Thanks for your advice, I was able to get a clue. Also, I am not using Angular here,


lol i didnt read the code it looked like angular :smiley: