1- import { Component , Input , Output , OnChanges , SimpleChange , EventEmitter , ViewEncapsulation , ContentChild , TemplateRef } from '@angular/core' ;
1+ import {
2+ Component , Input , Output , OnChanges , SimpleChange , EventEmitter ,
3+ ViewEncapsulation , ContentChild , TemplateRef , HostListener
4+ } from '@angular/core' ;
25import { TreeModel } from '../models/tree.model' ;
36import { TreeDraggedElement } from '../models/tree-dragged-element.model' ;
47import { TreeOptions } from '../models/tree-options.model' ;
58import { KEYS } from '../constants/keys' ;
69
7- import * as _ from 'lodash'
10+ import * as _ from 'lodash' ;
811
912@Component ( {
1013 selector : 'Tree' ,
1114 encapsulation : ViewEncapsulation . None ,
12- host : {
13- '(body: keydown)' : "onKeydown($event)" ,
14- '(body: mousedown)' : "onMousedown($event)"
15- } ,
1615 providers : [ TreeModel ] ,
1716 styles : [
1817 '.tree-children { padding-left: 20px }' ,
@@ -50,22 +49,18 @@ import * as _ from 'lodash'
5049 `
5150} )
5251export class TreeComponent implements OnChanges {
53- constructor ( public treeModel :TreeModel , public treeDraggedElement :TreeDraggedElement ) {
54- treeModel . eventNames . forEach ( ( name ) => this [ name ] = new EventEmitter ( ) ) ;
55- }
56-
57- _nodes :any [ ] ;
58- _options :TreeOptions ;
52+ _nodes : any [ ] ;
53+ _options : TreeOptions ;
5954
6055 @ContentChild ( 'loadingTemplate' ) loadingTemplate : TemplateRef < any > ;
6156 @ContentChild ( 'treeNodeTemplate' ) treeNodeTemplate : TemplateRef < any > ;
6257 @ContentChild ( 'treeNodeFullTemplate' ) treeNodeFullTemplate : TemplateRef < any > ;
6358
6459 // Will be handled in ngOnChanges
65- @Input ( ) set nodes ( nodes :any [ ] ) { } ;
66- @Input ( ) set options ( options :TreeOptions ) { } ;
60+ @Input ( ) set nodes ( nodes : any [ ] ) { } ;
61+ @Input ( ) set options ( options : TreeOptions ) { } ;
6762
68- @Input ( ) set focused ( value :boolean ) {
63+ @Input ( ) set focused ( value : boolean ) {
6964 this . treeModel . setFocus ( value ) ;
7065 }
7166
@@ -83,6 +78,11 @@ export class TreeComponent implements OnChanges {
8378 @Output ( ) onMoveNode ;
8479 @Output ( ) onEvent ;
8580
81+ constructor ( public treeModel : TreeModel , public treeDraggedElement : TreeDraggedElement ) {
82+ treeModel . eventNames . forEach ( ( name ) => this [ name ] = new EventEmitter ( ) ) ;
83+ }
84+
85+ @HostListener ( 'body: keydown' , [ '$event' ] )
8686 onKeydown ( $event ) {
8787 if ( ! this . treeModel . isFocused ) return ;
8888 if ( _ . includes ( [ 'input' , 'textarea' ] ,
@@ -93,6 +93,7 @@ export class TreeComponent implements OnChanges {
9393 this . treeModel . performKeyAction ( focusedNode , $event ) ;
9494 }
9595
96+ @HostListener ( 'body: mousedown' , [ '$event' ] )
9697 onMousedown ( $event ) {
9798 let insideClick = $event . target . closest ( 'Tree' ) ;
9899 if ( ! insideClick ) {
0 commit comments