通过子项无限制嵌套ngFor

我在Angular2中找到了几个关于嵌套ngFor循环的问题但不是我正在寻找的问题。 我想在列表中显示类别。 我的JSON看起来像这样：

{ Categories: [{ "Title": "Categorie A", "Children": [ { "Title": "Sub Categorie A", "Children": [] } ] },{ "Title": "Categorie B", "Children": [ { "Title": "Sub Categorie B", "Children": [{ "Title": "Sub Sub Categorie A", "Children": [] }] } ] }] } 

C＃类看起来像这样：

 public class Child { public string Title { get; set; } public List Children { get; set; } } public class Category { public string Title { get; set; } public List Children { get; set; } } 

现在的诀窍是在ngFor循环中得到它，而不会对子项的深度有任何限制。

Answer 1

我认为使用一个将自身呈现为子元素的组件非常简单：

 export interface Category { Title: string; Children: Category[]; } @Component({ selector: 'my-category', template: ` 
{{ category.Title }}
 
 
  
 
 ` }) export class MyCategoryComponent { @Input() category: Category; }