Search code examples
angularsingle-page-applicationangular-directive

How is it possible to interate within a ElementRef.nativeElement

I have a case which i decided to use a directive that needs to access the an ElementRef in order to manupulate the dom via Renderer.

At this point, since the Direcive placed on HTML element which is under *ngFor loop, when the directive call the elemenRef.nativeElement it gets a whole bouch of them (obviously one for each iteration of the *ngFor).

Is there a way to filter the nativeElements by ID or any sort of selection?

Thanks

Solution

  • Using renderer you can try this:

    In your html file:

    <div *ngFor="let element of elements">
   <div [attr.id]="element.id"></div>
</div>

    This will asing a id to every element in the *ngFor loop. Then in your ts file:

    let element = this.renderer.selectRootElement(`#${id}`);