Hi telerik team,
i am planing to build a app it contain more than 100 page,
1,Can i store this all data in json or any other choice?
2,How to bind Local json data value in my UI in a repeater format?
3,
my json structure is similar like this
{"books":[
{ "id":"book1" },
{ "id":"book2" },
{ "id":"book3" } up to 100 books may be there, each book has more than 50 chapter. when i click on book1 all chapter number will be shown after that each number should goes to pages using for router model. UI should in repeater format. how can i set router dynamically on each page? should i write component for each page? perhaps i need write components to each page it may cross more than 500 router. if i write this all app will slow and app size will be high. IS IT POSSIBLE WAY?
]}
3 Answers, 1 is accepted
As far as I understand, what you are trying to achieve is to create a list of repetitive elements (books) nd in which of the there will be another list of repetitive elements (chapters). What you need is to store the data for that repetitive elements and to visualise it without creating an enormously big application with a different component page for each book and chapter.
If what that is the case then you do not need to create 500 different component pages. What you need is the master-detail pages with a list structure which will load one pattern for each book and from there in each book again a record pattern for all the chapters. A list-view or a repeater should be able to resolve your case. For example on how to structure a larger list in the Angular-2 application, you can take a look at nativescript-sdk-examples-ng POC app here and more specifically the examples-list.component page. In the HTML page, we are loading all main categories which on the other had later can load to sub-lists with sub-examples. Here is the list of links loaded in this list (in your case that would be a list of books received from the JSON structure).The example also demonstrates how to use the Angular binding to create a different title for each page provided from the list of links (which in your case would be the content from the parsed JSON file)
To prevent all sub-examples loading at start-up (which will definitely slow your Angular-2 application a lot if you have hundreds of different sub pages to load) we are using lazy loading for the sub-modules.Great blog post about lazy loading in NativeScrtip + Angular-2 applications can be found here.
Regarding the creating and reading of JSON file in NativeScript - it really depends on how you want to structure your file and content but the concepts are pretty much the same - use the file-system module to create your file and JSON.parse to read the content and store it (in your view-model for example). Nice examples of reading a JSON file can be found here. Another example of how to proceed with JSON structured data coming from HTTP can be found here (this implementation does not save the content to JSON file but that would be just a matter of two more lines of code using file-system to create a file and store the content. The example also shows how to bind repetitive data in your UI (the principle is pretty much identical in Angular-2 application but using the angular binding syntax)
Regards,
Nikolay Iliev
Telerik by Progress
Rank 1
Hi Nativescript team,
1. nativescript share plugin how to use in html
eg: <Label text="Nativescript"></Label>
2. how to connect local dummy json in angular 2 project?
3.how to fix a add button on bottom of a screen it should be fixed?
4. dummy json data should be have share function, how can do these?
I found that you have opened a ticket with the same questions here,
Let's continue the discussion in the other ticket.
Best Regards,
nikolay.tsonev
Telerik by Progress