Error in Using component.js & Routing concepts

[Former Member]

Hi Experts,

I'm able to create custom UI5 apps with Component & Router concept, but i'm not able to use it in full fledged manner.

1. I'm able to create a UI5 App with Tiles(Every page is full page) & able to give Different Routes for Each Tile.

routing: {

  config: {

            viewType : "XML",

            viewPath: "zdemo_apBreakDown_app001.view",  // common prefix

            targetAggregation : "pages",

            targetControl: "fioriContent"

           },

  routes:[

       {

       pattern : "", // will be the url and from has to be provided in the data

       name : "LaunchPage",

       view : "LaunchPage"

       },

       {

       pattern : "BreakDown", // will be the url and from has to be provided in the data

       name : "BreakDown",

       view : "BreakDown"

       },

       {

       pattern : "FugaiRegister", // will be the url and from has to be provided in the data

       name : "TPM_FugaiRegister",

       view : "TPM_FugaiRegister"

       },

       {

       pattern : "Store", // will be the url and from has to be provided in the data

       name : "Store",

       view : "StoreRequisitionIssue"

       },

       {

       pattern : "TPM", // will be the url and from has to be provided in the data

       name : "TPM",

       view : "TPM"

       },

       ]

  }

  This is Working fine

2. I'm able to create a Master Detail app(Split app) & this will work fine with Routes(Detail/{context}).

     routing: {

     config: {

               viewType : "XML",

               viewPath: "zdemoAP_SplitApp.view",  // common prefix

               targetAggregation: "detailPages",

               clearTarget: false

                 },

     routes:[

            {

            name : "Master",

            view : "Master",

            targetAggregation : "masterPages",

            targetControl: "fioriContent",

            subroutes : [

                      {

                      pattern : "Detail/{contextPath}", // will be the url and from has to be provided in the data

                      view : "Detail",

                      name : "Detail" // name used for listening or navigating to this route

                      },

                      {

                      pattern : ":all*:", // catchall

                      view : "Detail",

                      name : "catchall", // name used for listening or navigating to this route

                      }

                      ]

          }

          ]

  }

  This is Working fine

My Question is when i want to create a App with two tiles

        Tile1 - Full page

        Tile2 - Split app

when i try to implement this i'm not getting the split app in second tile(or else only getting Master page Not Detail page), I'm pasting my code below can anyone suggest where i"m making mistake and how it actually works

     routing: {

     config: {

               viewType : "XML",

               viewPath: "zdemo_splitApp.view",  // common prefix

               targetAggregation: "pages",

               targetControl: "MainApp"

                 },

     routes:[

                 {

                 pattern : "",

                 name : "Launch_page",

                 view : "Launch_page",

                 },

                 {

                 pattern : "Tile1",

                 name : "TestTileRD",

                 view : "TestTileRD",

                 },

                 {

                 pattern : "split",

                 name : "Split_app",

                 view : "Split_app",

                 subroutes : [

                                  {

                                  name : "Master",

                                  view : "Master", 

                                  targetAggregation : "masterPages",

                                  targetControl: "SplitApp",

                                  subroutes : [

                                                    {

                                                    pattern : "Detail/{contextPath}", // will be the url and from has to be provided in the data

                                                    view : "Detail",

                                                    name : "Detail", // name used for listening or navigating to this route

                                                    targetAggregation : "detailPages",

                                                    targetControl: "SplitApp",

                                                    },

                                                    {

                                                    pattern : ":all*:", // catchall

                                                    view : "Detail",

                                                    name : "catchall", // name used for listening or navigating to this route

                                                     }

                                                     ]

                                  },

                                  ]

                    }

                    ]

     }

  This is Not Working not showing the Detail page.

I don't know how it will work actually and how the routing is donewhen the Sub Routes need to be used & when the Parent id will be used,

any help will be appreciated

Thanks & Regards,

Santhosh Reddy.

[Former Member · Accepted solution]

Hi santosh,

Go through the below blog. It speaks about navigating between a Full view and a SplitView.

regards

Indrajith

[Former Member · Accepted solution]

Hi Indrajith,

Its working fine...

Thanks for your Help.

[Former Member]

Try having the master as a parent with targetControl as "idAppControl". For the detail, create a subroute from the master.

For more information on this, refer to the Application Best Practices tutorial for Navigation and Routing: Step 3: Navigation and Routing - What's New in SAPUI5 - SAP Library

[Former Member]

Hi,

If you want to learn about routing concepts, refer to the below blog by me