You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Angular ngx-treeview报错“A text of item must be string object”求助

问题根因
  • 核心错误:ngOnInit中调用getItems时错误使用JSON.stringify序列化了this.json_obj,传入方法的是包含单条JSON字符串的数组,而非预期的TreeItem对象数组。遍历得到的set是字符串类型,不存在text属性,导致TreeviewItem初始化时读取text为undefined,触发Error : A text of item must be string object 校验报错。
  • 潜在问题:当前的嵌套构造逻辑仅完成了父节点(ParentID=0)的初始化,未将子节点填充到对应父节点的children数组中,后续无法正常展示多层级树结构;代码中as never的强制类型断言无意义,反而会隐藏类型校验问题。
修复方案

1. 修复传参错误(直接解决当前报错)

修改ngOnInit中的getItems调用参数,去掉不必要的序列化操作:

ngOnInit(): void {
  // 直接传入构造好的TreeItem对象数组即可
  this.items = this.getItems(this.json_obj);
}

getItems方法本身逻辑无需调整。

2. 补充子节点嵌套逻辑(可选,完善树结构)

如果需要生成完整的多层级树,可在父节点初始化完成后补充子节点匹配逻辑,示例如下:

// 先处理所有父节点
this.departments.forEach(element => {
  if(element.ParentID == 0){
    p_counter++;
    this.json_obj.push({
      text: element.DepartmentName,
      value: 'p'+p_counter.toString(),
      children: [],
      id: element.DepartmentID.toString()
    });
  }
});
// 再处理所有子节点,插入对应父级的children数组
this.departments.forEach(element => {
  if(element.ParentID !== 0){
    const parentNode = this.json_obj.find(item => item.id === element.ParentID.toString());
    if(parentNode) {
      parentNode.children.push({
        text: element.DepartmentName,
        value: 'c'+element.DepartmentID.toString(),
        children: [],
        id: element.DepartmentID.toString()
      })
    }
  }
});

3. 类型优化(可选)

给json_obj明确声明类型为TreeItem[],删除as never的强制类型断言,避免后续类型问题。

内容的提问来源于stack exchange,提问作者kobi shunak

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.09.30 07:54:04