NG-ZORRO 树形控件 标题名如何修改？

Question

<nz-tree
  [nzData]="nodes"
  nzCheckable
  nzMultiple
  [nzCheckedKeys]="defaultCheckedKeys"
  [nzExpandedKeys]="defaultExpandedKeys"
  [nzSelectedKeys]="defaultSelectedKeys"
  (nzClick)="nzEvent($event)"
  (nzExpandChange)="nzEvent($event)"
  (nzCheckBoxChange)="nzEvent($event)"
>
</nz-tree>


  nodes = [
{
  title: '0-0',
  key: '0-0',
  expanded: true,
  children: [
    {
      title: '0-0-0',
      key: '0-0-0',
      children: [
        { title: '0-0-0-0', key: '0-0-0-0', isLeaf: true },
        { title: '0-0-0-1', key: '0-0-0-1', isLeaf: true },
        { title: '0-0-0-2', key: '0-0-0-2', isLeaf: true }
      ]
    },
    {
      title: '0-0-1',
      key: '0-0-1',
      children: [
        { title: '0-0-1-0', key: '0-0-1-0', isLeaf: true },
        { title: '0-0-1-1', key: '0-0-1-1', isLeaf: true },
        { title: '0-0-1-2', key: '0-0-1-2', isLeaf: true }
      ]
    },
    {
      title: '0-0-2',
      key: '0-0-2',
      isLeaf: true
    }
  ]
},
{
  title: '0-1',
  key: '0-1',
  children: [
    { title: '0-1-0-0', key: '0-1-0-0', isLeaf: true },
    { title: '0-1-0-1', key: '0-1-0-1', isLeaf: true },
    { title: '0-1-0-2', key: '0-1-0-2', isLeaf: true }
  ]
},
{
  title: '0-2',
  key: '0-2',
  isLeaf: true
}

];

默认的title, 但后端返回给我的是name, 如何修改？

Answer 1

两种方案,第一就是改变递归修改数据源
第二就是自定义节点,这个官方就有例子

<nz-tree
  [nzData]="nodes"
  nzCheckable
  nzMultiple
  [nzCheckedKeys]="defaultCheckedKeys"
  [nzExpandedKeys]="defaultExpandedKeys"
  [nzSelectedKeys]="defaultSelectedKeys"
  (nzClick)="nzEvent($event)"
  (nzExpandChange)="nzEvent($event)"
  [nzTreeTemplate]="nzTreeTemplate"
  (nzCheckBoxChange)="nzEvent($event)"
>
</nz-tree>

<ng-template #nzTreeTemplate let-node let-origin="origin">
      <span class="custom-node">
         <span >{{ origin.name }}</span>
      </span>
</ng-template>