-
Notifications
You must be signed in to change notification settings - Fork 0
/
app.component.ts
80 lines (68 loc) · 2.06 KB
/
app.component.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
import {
Component,
ViewChild,
} from "@angular/core";
import { HttpClient } from "@angular/common/http";
import CustomStore from "devextreme/data/custom_store";
import { DxTreeViewComponent } from "devextreme-angular";
import Popup from "devextreme/ui/popup";
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
@ViewChild(DxTreeViewComponent, { static: false }) treeView: DxTreeViewComponent;
treeDataSource: any;
treeBoxValue: string[];
constructor(private httpClient: HttpClient) {
this.treeDataSource = this.makeAsyncDataSource(this.httpClient, 'treeProducts.json');
this.treeBoxValue = ['1_1', '1_1_1'];
}
makeAsyncDataSource(http: HttpClient, jsonFile: string) {
return new CustomStore({
loadMode: "raw",
key: "ID",
load(): Promise<any> {
return http
.get(
`https://js.devexpress.com/Demos/WidgetsGallery/JSDemos/data/${jsonFile}`
)
.toPromise();
}
});
}
onDropDownBoxValueChanged(e: any) {
this.updateSelection(this.treeView && this.treeView.instance);
}
onTreeViewReady(e: any) {
this.updateSelection(e.component);
}
updateSelection(treeView: any) {
if (!treeView) return;
if (!this.treeBoxValue) {
treeView.unselectAll();
}
if (this.treeBoxValue) {
this.treeBoxValue.forEach(((value) => {
treeView.selectItem(value);
}));
}
let element = document.querySelector("#myDropDownBox .dx-dropdowneditor-overlay");
if (element) {
let popup = Popup.getInstance(element) as Popup,
scrollable = treeView.getScrollable(),
scrollTop = scrollable.scrollTop();
popup.repaint();
scrollable.scrollTo(scrollTop);
}
}
onTreeViewSelectionChanged(e: any) {
this.treeBoxValue = e.component.getSelectedNodeKeys();
}
onTagBoxValueChanged(e: any) {
if (!this.treeView) return;
this.treeView.instance.unselectAll();
this.updateSelection(this.treeView.instance);
}
}