How to replace .p-breadcrumb-chevron with full stop in Angular

Question

I am using Prime ng Breadcrumbs and I want to replace pi-chevron-right into black dot in Angular.

.I am new to Angular..Anyone please help

Answer 1

You can do the following workaround using Renderer2 :

1 - inject Renderer2 inside constructor of your component

    constructor(private _renderer2:Renderer2){}

2 - implements AfterViewInIt interface

3 - inside ngAfterViewInIt() do the following:

    ngAfterViewInit(){
       let li:HTMLCollectionOf<Element> = document.getElementsByClassName('p-breadcrumb-chevron');
       for(let i =0 ;i<li.length;i++){
           this._renderer2.removeClass(li[i],'pi-chevron-right')
          this._renderer2.addClass(li[i],'pi-circle-fill')

      }
    }

it's a workaround but it works