How to create a Angular material tree using Dynamic data coming from the angular services

Question

I am very new to angular . I am trying this example to create tree. Here is the link. I tried to implement the same ex in my project with the same tree data. Screen shot https://stackblitz.com/angular/dnndeajnmkvp?file=app%2Ftree-nested-overview-example.ts

But I am not getting the expected results as shown in the example. Expand and collapse are not working,I am seeing dots in UI which is not in tree data. I have attached the screenshot. What might have been gone wrong am i missing anything in tree configuration.....??

Please provide a basic stackblitz of the code you have tried so far — Siddhartha Gupta
– Siddhartha Gupta, Commented Aug 23, 2019 at 9:52
@SiddharthaGupta have updated my question. Please can you help me out — Sushma
– Sushma, Commented Aug 24, 2019 at 19:04
The stackblitz seems to be working fine... It looks more likely a CSS issue.. Inspect and see if the 'list-style-type' is missing on the 'li' elements... It's hard to comment without looking at your css code — Siddhartha Gupta
– Siddhartha Gupta, Commented Aug 26, 2019 at 4:20

Eliseo · Accepted Answer · 2019-08-23 12:05:41Z

2

the diference between use a static value or data from a service is that you need subscribe to the service to get the data. I transform the the example of the example of material in this stackblitz

If you look the differences are

1.-In constructor add the service

constructor(private dataService:DataService){}

2.- implements OnInit and in ngOnInit

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

Well, in the example I use the 'rxjs' operator "of" to create an observable, you generally used this.httpClient.get(...your-url..)

answered Aug 23, 2019 at 12:05

Eliseo

58.9k4 gold badges39 silver badges82 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to create a Angular material tree using Dynamic data coming from the angular services

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related