Questions tagged [angular-renderer2]

The Renderer2 class is an abstraction provided by Angular in the form of a service that allows to manipulate elements of your app without having to touch the DOM directly.

Extend this base class to implement custom rendering. By default, Angular renders a template into DOM. You can use custom rendering to intercept rendering calls, or to render to something other than DOM.

85 questions
0
votes
1 answer

angular event listener document loaded

I am trying to select all pre elements in an angular component AFTER the document has been loaded. ngAFterViewChecked, ngAfterContentChecked, ngAfterContentInit basically run 30 times before the document is loaded, which will slow down my app. So,…
Jonathan
  • 3,893
  • 5
  • 46
  • 77
0
votes
1 answer

Angular renderer setStyle will not apply linear-gradient

Angular's renderer2 will not apply linear-gradient CSS. Can anyone see what I'm missing? export class AppComponent implements OnInit { constructor(private renderer: Renderer2, private elementRef: ElementRef) {} public ngOnInit(): void { …
Ben Racicot
  • 5,332
  • 12
  • 66
  • 130
0
votes
1 answer

Sending Data to an Angular Tooltip Directive

I have found an example online of a Tooltip directive. I need to expand it so I can pass data to the tooltip and render it in an *ngFor. So far I have app.component.html
See tooltip! …
Bwizard
  • 955
  • 2
  • 15
  • 36
0
votes
1 answer

migrate from renderer to renderer2

I migrated an project from Angular 7 to 8 and I had to change the Renderer class to Renderer2 and I am facing the following error: ERROR Error: Template error: Can't bind to 'disabled' since it isn't a known property of 'div'. at…
0
votes
1 answer

Dynamically add a div to elements with the same class using Angular

I need to add a div with class '.cart-list-value .delete-product', that contains a background image, to all elements that have the class .cart-list-item. I was able to get all the elements with class .carl-list-item , but when I add the new element,…
VictorE23
  • 3
  • 3
0
votes
1 answer

Close action menu item for table row in Angular

I have the following code for opening and closing a slide menu for each row in the table. The is as shown below:
Happy Coder
  • 4,255
  • 13
  • 75
  • 152
0
votes
1 answer

Can Angular Renderer2 setStyle function operate on an element where the style attribute is not yet defined?

In an Angular application let's suppose we have a body element as ... and now I want to set its background to some value using Angular Renderer2 as this.renderer.setStyle(document.body, 'background',…
Romuald
  • 205
  • 1
  • 13
0
votes
0 answers

Is it possible to add structural directives like *ngIf and *ngFor to elements that are added to DOM using renderer 2?

this.renderer.setAttribute(this.element.nativeElement, '*ngIf', 'test'); Can we use like this?
0
votes
1 answer

Add a SASS mixin with Angular Renderer2

I would like to add the make-col mixin defined by Bootstrap with the Angulars Renderer2. Context The idea is to create a directive that receives two inputs: The number of columns the element should use The total amount of columns And adds the…
R. de Ruijter
  • 513
  • 5
  • 13
0
votes
0 answers

How to add an event listener to dynamically generated content using Renderer2?

I am trying to add a click event listener to a div that is dynamically generated after page load but I can't seem to get the event to register. I am following the instructions found in this answer however, it is not working for me. In my ngOnInit()…
Jordan Lewallen
  • 1,681
  • 19
  • 54
0
votes
1 answer

Retain UI Element position when model updates using Angular cdkDrag

Within a view I have a component that is using Angular cdkDrag to move elements around on a dashboard. The data to this component is pass down from the parent (via single way binding) which is subscribed to a SignalR Hub. The issue I am having is…
0
votes
1 answer

How can I remove from the body?

I want to remove an opened modal on a page but I could not access to this div element that lock the document, I could not access to this div, to define an ID or Name to remove it by Renderer2, something…
0
votes
0 answers

Am i unsubscribing correctly from Renderer2's .listen function?

I am adding multiple listeners to elements generated by render2. I am doing something like this, unlistenCallbacks:any[] = []; ..... const unlistenCallback = this.renderer.listen( ......…
Bogdan B
  • 846
  • 9
  • 23
0
votes
1 answer

Store reference of nativeElement created with renderer2

I'm trying to implement a drag and drop directive. The drag and drop works. I'm trying to handle the click now, to have the same behaviour that with an input type="file". My plan is to add an invisible with Renderer2 and to forward click on…
Adrien H
  • 643
  • 6
  • 21
0
votes
1 answer

Angular 6 - Renderer2 - [dynamic] DOM not getting created - SELECT-Option

am trying to create select option dynamically using Renderer2. at present am not able to create element. but i can see able to see are created. due to some concerns am not allowed to share all snippets. apologizes for…
Mr. Learner
  • 978
  • 2
  • 18
  • 48