CODEWITHSUNDEEP
angularangular-renderer2
Neeraj Jain
Neeraj Jain

Reputation: 7730

Angular - Renderer2 : How to Set Attribute without value?

There is a post on Set Attribute Without value which provides a good solution using $('body').attr('data-body','');

However, in my current ionic project, I am using Angular's Renderer2 API to manipulate DOM, and I have a requirement to create a button dynamically and also to set ion-button as one of the attributes.

I am able to set the attributes which are having value with the below code, but not getting any luck in figuring out how to add the attribute without the value.

// Make Copy Button functional
   this.renderer.setAttribute(code, 'id', 'copy-target');
   this.renderer.addClass(button, 'copy-button');
   this.renderer.setAttribute(button, 'data-clipboard-action', 'copy');
   this.renderer.setAttribute(button, 'data-clipboard-target', '#copy-target');

   this.renderer.setAttribute(button, 'ion-button', null); // this doesn't work.

Any guidance is appreciated.

Upvotes: 3

Views: 10821

Answers (1)

Roberto Zvjerković
Roberto Zvjerković

Reputation: 10137

You should just pass an empty string. I just tried: 

this.r.setAttribute(this.div.nativeElement, "ion-button", "");

On

@ViewChild("div") div: ElementRef;

And got

<div _ngcontent-c0="" ion-button="">Divara</div>

Which is the same as 

<div _ngcontent-c0="" ion-button>Divara</div>

Chrome even renders it like that in developer tools:

enter image description here

Upvotes: 2

Related Questions