Defines a Page component.

This component helps creating pages for your application with all required files and references.
To be displayed correctly, your Page component should contain:
• a Header component
• a Content component
• a Footer component


The Header is a root component that sits at the top of the page and may hold NavBar or Toolbar components.
The Footer is a root component that sits at the bottom of the page and may hold Toolbar component.
The Content is a root component that sits at the middle of the page and holds all other components.
You can also write some custom code by using the “Edit Page class” menu.
This will enable you to run some type script
between the markers
/* Begin_c8o_xxxxxxxxxxx */
and the markers
/* End_c8o_xxxxxxxxxxx */
Within a page, you can access some object from any CustomAction or Action property or Action variable :
• in a CustomAction use page[“myObject”] to access a “myObject” declared in the page class
• in an Action variable or property (TS Mode) use c8opage[“MyObject”] a “myObject” declared in the page class
• in an Action variable or property (TS Mode) use this.MyFunction() to invoke a ‘MyFunction()’ declared function in the page class
• in a CustomAction use props.stack[“root”].in.myIndex to access a ‘myIndex’ or ‘myItem’ variable configured in a ‘ForEach’ directive
• in an Action variable or property (TS Mode) use stack[“root”].in.myIndex to access a ‘myIndex’ or ‘myItem’ variable configured in a ‘ForEach’ directive

Name Description
Comment Describes the object comment to include in the documentation report. This property generally contains an explanation about the object.
Include in auto menu Defines whether the page should be included in any automatic menu.
Is active Defines whether the page is active.
Menu icon Defines the page icon to be displayed in menu.
Menu icon position Defines the menu icon position beside title text.
Menu title Defines the page title to be displayed in menu.
Page end menu Defines the specific end menu to use for this page instead of default first one.
Page start menu Defines the specific start menu to use for this page instead of default first one.
Changes detection strategy Defines the page’s changes detection strategy. For more information: ChangeDetectionStrategy.
Preloading Defines the page’s preloading priority at app bootstrap. The following values are possible for priority: high, low, and off.
All pages with their priority set to high will be loaded first. Upon completion, all pages with a priority of low will be loaded.
If the priority is set to off the page will not be preloaded.
Segment Defines the page segment for direct route. Syntax: some-part or some-part/another-part or some-part/:param-name