How to reflect CSS based on ngIf condition in angular2

Question

I have 2 field, one is image upload and video upload. I want the part of css to reflect only on video part. Can anyon help me to solve this.

HTML:

<div class="row">
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12" *ngFor="let media of medias; let i = index">
  <div class = "type-img" [hidden]= "selectedImage !='img'">
    <img class="cat-img" src="{{media.image_path}}" style="width: 100px;margin: 10px 0px;" type='img' *ngIf="selectedImage=='img'" />
  </div>
  <div class = "type-video" [hidden]= "selectedImage !='video'" >
  <video width="320" height="240" controls> <source src="{{media.image_path}}" type="video/mp4" *ngIf="selectedImage=='video'" ></video>
  </div>
  <p class="inputimg video">
    <input type="file" name="{{media._id}}[i]" id="{{media._id}}[i]" class="inputfile" (change)="editPinImage($event,media)" style='display: none;' />
    <label *ngIf="media._id" for="{{media._id}}[i]" class="img_change">Change</label>
    <label *ngIf="!media._id" for="{{media._id}}[i]" class="img_change">Add</label>
  </p>
  <div class = "type-video"  [hidden]= "selectedImage !='video'" >
  <span style="margin-left: 12%;">or </span>
  <input type="text" class="form-control form-textbox input-text" (change)="editPinImage($event,media)" style="width: 28%;margin-right: 24%;">
  </div>
</div>

Here, <p class="inputimg video"> , i need this part of css to work only for video

.video {
  float: right;
  margin-right: 56%;
  margin-top: -2%;
}

Answer 1

Use NgClass for it. Hope you need video class when selected image is 'video'

<p class="inputimg" [ngClass]="{'video': selectedImage =='video'}">