如何在单击窗口小部件的外侧隐藏树视图（DevExtreme小部件）

Question

我在项目中使用DevExtreme小部件。我想隐藏树视图＆＃39;当用户点击小部件外部时。

我的代码如下。任何人都可以提供帮助。

<div class="form">
    <dx-text-box
        #textBox
        placeholder="Search"
        [width]="300"
        mode="search"
        valueChangeEvent="keyup"
        value=""
    ></dx-text-box>
    <dx-tree-view
        id="simple-treeview"
        [items]="products"
        [width]="300"
        [searchValue]="textBox.value"
        (onItemClick)="selectItem($event)"
    ></dx-tree-view>
    <div id="product-details" *ngIf="currentItem.price">
        <img [src]="currentItem.image" />
        <div class="name">{{currentItem.text}}</div>
        <div class="price">{{"$" + currentItem.price}}</div>
    </div>
</div>