Block: RouterOutlet

A RouterOutlet block for configuring an outlet into which frames can be inserted.

Overview

The RouterOutlet block is used for configuring an outlet into which frames can be inserted. In this way, a hierarchical structure of nested frames can be defined. Note that each frame should typically only contain at most a single RouterOutlet block.

The frame that is inserted into a router outlet is define by the router defined in the Solution object.

Example

Below is an example configuration.

kind: Solution
version: v0
router:
  kind: Router
  routes:
    - frame: home-frame
      children:
        - frame: sub-frame1 # route is /home-frame/sub-frame1
        - frame: sub-frame2 # route is /home-frame/sub-frame2
frames:
  home-frame:
    kind: Frame
    contents:
      my-button1:
        kind: Button
        text: Go to sub frame 1
        routerLink: /home-frame/sub-frame1
      my-button2:
        kind: Button
        text: Go to sub frame 2
        routerLink: /home-frame/sub-frame2
      my-outlet:
        kind: RouterOutlet # contains children frames
  sub-frame1:
    kind: Frame
    contents:
      text1:
        kind: Text
        text: This is sub-frame 1
        type: display-1
  sub-frame2:
    kind: Frame
    contents:
      text1:
        kind: Text
        text: This is sub-frame 2
        type: display-1

RouterOutletConfig

An object for configuring a router outlet. The frames that are inserted into the outlet are defined in the routes property of the solution. If an outlet is placed in a layout area with a fixed row height, the content will be scrollable by default . Setting the overflow property to false disables the scrollbar.

Name	Type	Required	Description
`kind`	`"RouterOutlet"`	Yes	A constant, `RouterOutlet`.
`overflow`	`boolean`	No	A boolean specifying what happens when the content in an outlet frame is longer than the height of the area. If `overflow` is false, then content is visible and extends below the the area. If `overflow` is true, then content becomes scrollable using a scrollbar that appears to the right side of the area. The default is true.