want to know how the data is passed from Sling model to typescript

[rahul234dabas]

hi, I have a textfield which I can access it in my sling model using the annotation @ValueMapValue but I want to use my field in textfield and I am not able to know how it's being passed : 

here is the example : 

type LocationsData = Readonly<{

  locations?: LocationItem[];

  zoomLevel?: number;

  northAmericaLocations?: LocationItem[];

  europeMiddleEastAfricaLocations?: LocationItem[];

  asiaLocations?: LocationItem[];

  fileReference?: string;   // this field I have added new and not able to access it 

}>;

const LocationComponent: AemComponent<LocationsData> = ({ $data, setEvents, $find }) => {

  var index = 0;

  console.log("the data is : ",$data); // this contains data from sling model

  const { locations,zoomLevel, northAmericaLocations, europeMiddleEastAfricaLocations,asiaLocations ,fileReference} =

    $data;

}

AemComponentRegistrar.registerComponent(CMP_NAME, LocationComponent);

My "$data" contains the data all fields of "LocationsData" but didn't contains the newly added field " fileReference" in it 

can anyone tell me how can I pass data from Sling model to TypeScript 

Thank you

[B_Sravan · Accepted solution]

Hi @rahul234dabas,

To the best of my knowledge, you cannot pass a value from a sling model to any script.
I would suggest,

1. To retrieve your value onto html (to a hidden div, if you don't want to display), by using the standard approach and then read the div content to your script. 
2. To make use of sling exporters, where you can have the data from your sling model directly in Json/Xml format. More on Exporters.

Thank you.

-Sravan