{"_id":"5b65b08eb1906e000319f859","category":{"_id":"5b65b08eb1906e000319f854","version":"5b65b08eb1906e000319f872","project":"5707c6875309d117006948d4","__v":0,"sync":{"url":"","isSync":false},"reference":false,"createdAt":"2017-07-15T07:28:09.870Z","from_sync":false,"order":0,"slug":"getting-started","title":"Basic"},"project":"5707c6875309d117006948d4","user":"54d742a80771980d0052f4b5","parentDoc":null,"version":{"_id":"5b65b08eb1906e000319f872","project":"5707c6875309d117006948d4","__v":0,"forked_from":"5aff027686c0a90003b923b4","createdAt":"2018-03-23T13:06:33.352Z","releaseDate":"2018-03-23T13:06:33.352Z","categories":["5b65b08eb1906e000319f854","5b65b08eb1906e000319f855","5b65b08eb1906e000319f856"],"is_deprecated":false,"is_hidden":false,"is_beta":false,"is_stable":true,"codename":"","version_clean":"8.0.0","version":"8.0.0"},"githubsync":"","__v":0,"updates":[],"next":{"pages":[],"description":""},"createdAt":"2017-12-15T21:31:46.977Z","link_external":false,"link_url":"","sync_unique":"","hidden":false,"api":{"settings":"","results":{"codes":[]},"auth":"required","params":[],"url":""},"isReference":false,"order":2,"body":"[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"    <tree-root [nodes]=\\\"nodes\\\" [options]=\\\"options\\\"></tree-root>\\n\",\n      \"language\": \"javascript\"\n    }\n  ]\n}\n[/block]\n\n[block:api-header]\n{\n  \"type\": \"basic\",\n  \"title\": \"options\"\n}\n[/block]\nObject of type `ITreeOptions`.\nSee [TreeOptions](doc:options) for a complete list, or visit the Guides category for specific use cases.\n\nExample:\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"import { TREE_ACTIONS, KEYS, IActionMapping, ITreeOptions } from 'angular-tree-component';\\n\\nclass MyComponent {\\n  ...\\n\\toptions: ITreeOptions = {\\n    displayField: 'nodeName',\\n    isExpandedField: 'expanded',\\n    idField: 'uuid',\\n    hasChildrenField: 'nodes',\\n    actionMapping: {\\n      mouse: {\\n        dblClick: (tree, node, $event) => {\\n      \\t\\tif (node.hasChildren) TREE_ACTIONS.TOGGLE_EXPANDED(tree, node, $event);\\n    \\t\\t}\\n      },\\n      keys: {\\n        [KEYS.ENTER]: (tree, node, $event) => {\\n          node.expandAll();\\n        }\\n      }\\n    },\\n    nodeHeight: 23,\\n    allowDrag: (node) => {\\n      return true;\\n    },\\n    allowDrop: (node) => {\\n      return true;\\n    },\\n    levelPadding: 10,\\n    useVirtualScroll: true,\\n    animateExpand: true,\\n    scrollOnActivate: true,\\n    animateSpeed: 30,\\n    animateAcceleration: 1.2,\\n    scrollContainer: document.documentElement // HTML\\n  }\\n}\",\n      \"language\": \"javascript\"\n    }\n  ]\n}\n[/block]","excerpt":"","slug":"options-2","type":"basic","title":"Options"}
[block:code] { "codes": [ { "code": " <tree-root [nodes]=\"nodes\" [options]=\"options\"></tree-root>\n", "language": "javascript" } ] } [/block] [block:api-header] { "type": "basic", "title": "options" } [/block] Object of type `ITreeOptions`. See [TreeOptions](doc:options) for a complete list, or visit the Guides category for specific use cases. Example: [block:code] { "codes": [ { "code": "import { TREE_ACTIONS, KEYS, IActionMapping, ITreeOptions } from 'angular-tree-component';\n\nclass MyComponent {\n ...\n\toptions: ITreeOptions = {\n displayField: 'nodeName',\n isExpandedField: 'expanded',\n idField: 'uuid',\n hasChildrenField: 'nodes',\n actionMapping: {\n mouse: {\n dblClick: (tree, node, $event) => {\n \t\tif (node.hasChildren) TREE_ACTIONS.TOGGLE_EXPANDED(tree, node, $event);\n \t\t}\n },\n keys: {\n [KEYS.ENTER]: (tree, node, $event) => {\n node.expandAll();\n }\n }\n },\n nodeHeight: 23,\n allowDrag: (node) => {\n return true;\n },\n allowDrop: (node) => {\n return true;\n },\n levelPadding: 10,\n useVirtualScroll: true,\n animateExpand: true,\n scrollOnActivate: true,\n animateSpeed: 30,\n animateAcceleration: 1.2,\n scrollContainer: document.documentElement // HTML\n }\n}", "language": "javascript" } ] } [/block]