unable to iterate over an array within my html

Question

I am trying to make a breadcrumb component for angular7 but I can't get my array to properly show into my HTML and would like some tips because I can't find it on the internet. if you would be so kind as to help me I am still new to angular and can't think of a better way to make a breadcrumb component.

my component.ts -

breadcrumbLists: Array <any> = []; breadcrumburl: Array <any> = []; constructor(private _router: Router) { } ngOnInit() { this.listenrouting(); } listenrouting(): void { let routerUrl: string, routerList: Array < any > ; let i; let done; this._router.events.subscribe((router: any) => { routerUrl = router.urlAfterRedirects; if (routerUrl && typeof routerUrl === 'string') { this.breadcrumbLists.length = 0; routerList = routerUrl.slice(1).split('/'); this.breadcrumbLists = routerList; if (done != false) { this.breadcrumbLists.forEach(bread => { if (i != null) { this.breadcrumburl.push([{ name: bread }, { url: i + "/" + bread }]) } else { this.breadcrumburl.push([{ name: bread }, { url: "/" + bread }]) } i = "/" + bread }); } console.log("url", this.breadcrumburl) console.log(this.breadcrumbLists) done = false; } }); }

and then my HTML -

<nav> <div> <li *ngFor="let Breadcrumb of breadcrumburl"> <a routerLink="{{Breadcrumb.url}}">{{Breadcrumb.name}}</a> </li> </div> </nav>

if that was it I was going to scream but it wasn't it was a mistake in my code to — Marc Roelse
– Marc Roelse, Commented Feb 20, 2019 at 13:47
it doesn't work like that but your answer works thanks I tried it because I knew they where nested array's but I thought I tried that but I don't think so because now no errors — Marc Roelse
– Marc Roelse, Commented Feb 20, 2019 at 14:16

Tushar Walzade · Accepted Answer · 2019-02-20 14:11:46Z

If I'm not wrong, you want to push into breadcrumburl array as -

this.breadcrumburl.push({name: bread, url: i + "/" + bread});

Currently, you created nested arrays & pushed 2 elements in all nested arrays in breadcrumburl

Collectives™ on Stack Overflow

unable to iterate over an array within my html

1 Answer 1

Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Related