How to add style to body from component dynamically

Question

I want to add style="overflow:hidden" in body tag dynamically from component on click if a button. On click of this <a> isWriteEmail will be true and at that time it should add the overflow:hidden to body

<a href="javascript:void(0)"
    class="mail-ac-ico"
    (click)="appComponent.isWriteEmail = true;"
    data-toggle="tooltip"
    tooltip="Compose"
    title="Compose">
    <img src="assets/images/icons/icon-open-email.png"
                            alt="email icon">
</a>

tried this <body *ngIf="isWriteEmail" style="overflow: hidden;"> didn't work

Possible duplicate of [Add class to body on Angular2](https://stackoverflow.com/questions/39971762/add-class-to-body-on-angular2) — , Jun 20 '17 at 05:48

score 0 · Answer 1 · answered Jun 19 '17 at 12:56

0

You have to create a class:

.overflowHidden {
    overflow: hidden
}

Then, in the template:

<a href="javascript:void(0)"
    class="mail-ac-ico"
    (click)="appComponent.isWriteEmail = true;"
    [class.overflowHidden]="appComponent.isWriteEmail"
    data-toggle="tooltip"
    tooltip="Compose"
    title="Compose">
    <img src="assets/images/icons/icon-open-email.png" alt="email icon">
</a>

answered Jun 19 '17 at 12:56

Faly

12,802
1
18
35

adding class here won't work, need to add overflow to `body` – Nikhil Radadiya Jun 19 '17 at 13:23

How to add style to body from component dynamically

1 Answers1