Angular EasyUI 樹

2020-06-24 17:27 更新

樹（ TreeComponent ）在網頁中以樹形結構顯示分層數據。 樹（ TreeComponent ）向用戶提供展開、折疊、拖拽、編輯和異步加載功能。

屬性列表

名稱 數據類型 作用描述 默認值
data any[ ] 要加載的數據。 [ ]
selection any 選中的節(jié)點。 null
checkbox boolean 是否在每個節(jié)點前顯示復選框。 false
cascadeCheck boolean 是否進行級聯檢查。 true

事件列表

名稱 參數 作用描述
selectionChange node 選擇節(jié)點時觸發(fā)。
nodeClick node 單擊節(jié)點時觸發(fā)。
nodeExpand node 在展開節(jié)點時觸發(fā)。
nodeCollapse node 當節(jié)點被折疊時觸發(fā)。
nodeCheck node 檢查節(jié)點時觸發(fā)。
nodeUncheck node 當節(jié)點未選中時觸發(fā)。
checkChange nodes 更改選中節(jié)點時觸發(fā)。
nodeContextMenu node,  originalEvent 右擊節(jié)點時觸發(fā)。

字段列表

名稱 類型 作用描述
checkedNodes any[ ] All the checked nodes 。

方法列表

名稱 參數 返回值 作用描述
selectNode node void 選擇一個節(jié)點。
checkNode node void 檢查節(jié)點。
uncheckNode node void 取消一個節(jié)點。
uncheckAllNodes none void 取消所有節(jié)點。
doFilter q:any void 執(zhí)行篩選操作。

作用域

名稱 參數 作用描述
default node 節(jié)點作用域。
editor node 編輯節(jié)點作用域。

注：
- 繼承： None 。
- 選擇器： eui-tree 。

使用方法

<eui-tree [data]="data" [(selection)]="selection"></eui-tree>
<p *ngIf="selection">Selected: {{selection.text}}</p>

  • 參考圖例：

Tree

以上內容是否對您有幫助：
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號
微信公眾號

編程獅公眾號