angular cli8利用组件递归实现无限级树型结构

1、应用场景

实际开发中经常会遇到需要构造超过三级甚至是无限级树型结构的情况，如果采用逐级拼装的方法将会十分麻烦并且工作量陡增，此时采用递归的方式将会大大简化代码结构并且收到轻巧灵便的效果；在angular中主要是通过组件递归来实现。

2、核心思想

1、在父组件的元素上绑定需要递归的数据和递归组件的选择器：

// treeDataes为需要递归的数据
// recursive-root为递归组件的选择器
<ul [treeDataes]="treeDataes" recursive-root></ul>

2、在递归组件中接收父组件传入的数据，并在其模板中调用递归组件自身：

// treeDataes为父组件传入的数据
// recursive-root为递归组件的选择器
<li *ngFor="let item of treeDataes">
	<span>{
   {
   item.name}}</span>
	<ul *ngIf="item.childs" [treeDataes]="item.childs" recursive-root></ul>
</li>

3、具体实现

以下父组件的文件内容：

// nolimits.component.ts
import {
    Component } from