如何使用来自 Angular 服务的动态数据创建 Angular 材质树

【问题标题】：How to create a Angular material tree using Dynamic data coming from the angular services如何使用来自 Angular 服务的动态数据创建 Angular 材质树
【发布时间】：2019-08-23 09:19:33
【问题描述】：

我对 angular 很陌生。我正在尝试这个例子来创建树。链接在这里。我试图在我的项目中使用相同的树数据实现相同的 ex。 Screen shot https://stackblitz.com/angular/dnndeajnmkvp?file=app%2Ftree-nested-overview-example.ts

但我没有得到示例中所示的预期结果。展开和折叠不起作用，我在 UI 中看到不在树数据中的点。我附上了截图。如果我在树配置中遗漏了任何内容，可能出了什么问题.....？？

【问题讨论】：

请提供您目前尝试过的代码的基本堆栈
@SiddharthaGupta 更新了我的问题。请你帮帮我
stackblitz 似乎工作正常......它看起来更有可能是一个 CSS 问题......检查并查看“li”元素上是否缺少“list-style-type”......不看你的css代码很难评论

标签： angular angular-material angular6

【解决方案1】：

使用静态值或来自服务的数据的区别在于您需要订阅服务才能获取数据。我把the example of material的例子转换成this stackblitz

如果你看差异是

1.-在构造函数中添加服务

constructor(private dataService:DataService){}

2.- 实现 OnInit 和 ngOnInit

  ngOnInit()
  {
    this.dataService.getData().subscribe(res=>{
        this.dataSource.data = res;
    })
  }

好吧，在示例中我使用 'rxjs' 运算符“of”来创建一个 observable，您通常使用 this.httpClient.get(...your-url..)

【讨论】：