Table of Contents

How to use JSON Scraping addons

  1. The first step, We are required to turn off the Ionic Emulator, on your Command Prompt / Terminal (NodeJS) press Ctrl + C button on keyboard.
  2. Create a new page, for example I will give the name Technology. This is the page that will be targeted for automatic coding.
    1. Go to Pages menu
    2. Then click New Page button
    3. Write the text of page title with the name: Technology and the other entries just leave it blank or default
    4. Then click Save Changes button
  3. Next, We will connect the menu to that page
    1. Go to Menus menu
    2. In the section of General, New Item field type 1 value
    3. Then click Add New Item button
    4. New item will appear at the bottom by the name: New Item X and then click Down Arrow button
    5. Next, click Edit button
    6. Then We will edit the properties of the menu: Type: Goto Internal Link, Variable: empty/blank, Label: Technology and Page: Technology (technology) and for others fields are keep default
    7. And click the save change button
  4. Well, we will continue using the addons feature
    1. Go to Add-Ons menu
    2. Then click Choose button in JSON Scraping box
    3. Then complete the following fields:
      • Overwrite The Page, make sure you select the page that will be used to target the code that will be created, this will result in the old code being overwritten, so we will select Technology
      • Page Title, Is the title of the page that will be made
      • JSON URL for List Item, this is a data source that uses the json format and allows crossdomain (CORS). JSON array can contain multiple objects, example:
        [{id:1,name:...},{id:2,name:...},{id:3,name:...}]
      • 1st Variable for List Item, default value is blank but if JSON URL contain single objects, you must fill this option, example: {items:[{...},{...}]} then you must fill .items
      • Template for List Item, this is the basic template for the application page, if you want a better display, of course you have to edit and re-edit the codes that have been made
      • JSON URL for Single Item, If left blank, this will automatically take from the json listing (default value is blank). To fill in this field the conditions are JSON objects can contain multiple name/values
      • 1st Variable for Single Item, default value is blank but if JSON URL contain single objects you must fill this option
      • Template for Single Item, the basic template for single item
    4. Variables for Layout, Please fill in or select the variable, Label and Type. This will be useful for filling in the Template for List Item and Templates for Single Item. and you can checked to display it and uncheck it to remove it.

      for those of you who don't really understand reading variables on json, you can click get all variables. it will be very helpful.
    5. Variable as ID?, the variable used as an ID. this is necessary for links to single pages.
    6. Search by Variable?, the variable used for search
    7. Icon Default, not so necessary for some templates. but for templates like Icon List it is very necessary.
    8. Finally click Save Changes button.
  5. Now, You have to update native plugins that are needed by your ionic project, to see instructions and the list of plugins needed go to the Native Plugins menu, You can install it using using your Command Prompt / Terminal (NodeJS)
  6. Finally, you can run your ionic emulator.

Last edit: 2019-02-08 07:28:17

Comment

For any question about products, please contact email support is: info@ihsana.com and info@ihsana.net
img