【发布时间】:2018-02-15 15:47:58
【问题描述】:
--**app.component.ts**
import { Component,OnInit } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { Subject } from 'rxjs/Subject';
@Component({
selector: 'my-app',
templateUrl:'./app.component.html'
})
export class AppComponent implements OnInit {
Tree: any;
private searchText$ = new Subject<string>();
ngOnInit() {
this.Tree = this.myTree;
}
myTree = [
{ name: "parent1", subnodes: [{ name: "parent1_child1", subnodes: [{ name: "parent_child1_child1", subnodes: [] }] },{ name: 'parent1_child2', subnodes: [] }] },
{
name: "secondparent2",
subnodes: [
{ name: "secondparent2_child1", subnodes: [] }
]
},
{
name: "thirdparent3",
subnodes: [
{
name: "Chandigarh3",
subnodes: [
{ name: "parent3_child1_child1", subnodes: [] }
]
}
]
}
];
filter(name: string):any {
this.Tree = this.myTree.filter(data => data.name.match(name) || (data.subnodes.filter(subnode => (subnode.name.match(name))).length > 0) ? true:false);
}
search(input: string, data: any): boolean {
let output= data.subnodes.filter(subdata => (subdata.name.match(name)))
if (output != undefined && output.length > 0) {
return true;
}
else {
return false;
}
}
}
--**app.component.html**
<h1>Tree as UL</h1>
<tree-view [treeData]="Tree"></tree-view>
<input type="text" (keyup)="filter($event.target.value)" />
我可以过滤第一个父节点和相应的子节点,但之后如何过滤子节点? 我已经编写了搜索函数,所以我可以通过传递输入和树从过滤方法调用搜索方法,我想递归地使用搜索方法
【问题讨论】:
-
我添加了答案
标签: angular tree angular2-template angular2-directives