Page History
...
Note |
---|
Only one of the contains and excludes properties should be present in a layout specification. If excludes is present, then contains will be ignored. |
Layouts in NG2 supports also simple behavior through Angular Directives
Code Block | ||||
---|---|---|---|---|
| ||||
{
"name": "collapsible",
"displayName": "Collapsible Container",
"version": 1,
"icon": "12grid/collapsible/collapsible.png",
"definition": "collapsible/collapsible.json",
"designStyleClass" : "rowDesign",
"categoryName":"Templates",
"contains": ["12grid.div"],
"topContainer": true,
"directives": ["gridCollapse"],
"tagType":"div"
} |
The above spec says with the "directives" tag that this tag (which is just a div according to the tagType) should have a Angular directive also generated on its tag that is the created at runtime and can influence the behavior of the collapsible div and/or its children.
This is done by saying in the manifest of the grid package that it is also an npm package with a angular module:
Code Block | ||||
---|---|---|---|---|
| ||||
NPM-PackageName: @servoy/12grid
NG2-Module: GridModule
|
Then the layout package must provide this angular npm package having that GridModule as a class an example can be seen here: 12grid/project at master · Servoy/12grid (github.com) with a the collapsible directive that adds behavior to the layout tag here: 12grid/collapse.directive.ts at master · Servoy/12grid (github.com)
The designStyleClass
The designStyleClass property is used to express how the layout container is displayed in the Exploded view. The Exploded view makes the structure of layout containers more visible in the designer.
...