《Angular之ITOO组件树引用爆发的问题》

前言：

                                                      千锤万凿出深山，烈火焚烧若等闲。

正文：

   一。问题描述      

ERROR Error: Uncaught (in promise): Error: Template parse errors:

Can't bind to 'treeURL' since it isn't a known property of 'app-tree'.

1. If 'app-tree' is an Angular component and it has 'treeURL' input, then verify that it is part of this module.

2. If 'app-tree' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.

3. To allow any property add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component. ("<br/>

<div class="col-md-2" id="treemenu">

    <app-tree [ERROR ->][treeURL]="treeURL" [treeTitle]="'考试信息管理'" (editData)="editNode($event)" ></app-tree>

</div>

        见下图：

    二。问题定位 

      组件树引入有误：

1. 排查是否按照组件树引入流程文档操作正确
2. 验证第一步正确后，排查是否因缓存等问题导致错误依然存在
3. 验证第二部后，基本确定是组件树本身的原因：

1. 组件封装时，出现问题
2. 组件发布时出现问题
3. 组件发布后，没有及时修改引入流程文档问题：

     在详细定位组件树本身出现哪些问题：

     <1>按照报错点，先报错的代码删掉。比如此次先将[treeURL]这个字段删除，发现可以运行，与node库中的源码对比，看是否与封装的字段一致

     <2>第一步解决后，出现第二个问题，json数据读取不了，路径正确，对比json数据字段与源码要求的字段是否一致。最终确定问题，解决问题。

     此次问题定位在组件树本身的问题，并且是由于封装组件树的人发布新版本，但没有及时修改引入流程文档所致。

    三。 解决方案    

     简而言之，三步到位：

1. 修改html中[treeURL]→[institutionId]
2. 修改json数据字段：”items”→”TreeModelList”

     3.总负责人修改package.json文件，修改ng-itoo-tree版本号，开发人员更新package.json，卸载node库，重新下载依赖包，重新启动项目

结语：

                                                            宝剑锋从磨砺出，梅花香自苦寒来。