Angular 6 - ne otvara bootstrap modal

Pozdrav,

Ovo je modal koji radi na stranici #1, ali na stranici #2 uopste nece da ga prikaze, osim kada iz prve linije sklonim "class= 'modal fade'", ali u tom slucaju modal ne zatamnjuje pozadinu vec bude vidljiv kao i svaku drugi element.

Probao sam sve sto mi je palo na pamet ali bez rezultata.
Gde gresim? :)

EDIT: Radi samo u slucaju kada dodam dugme koje ce imati " data-toggle="modal" data-target="#leaveGroupModal" ", ali ne i ako hocu samo sa NgIf promenjivom.

[code]
<div *ngIf="displayModal" class="modal fade" id="search-people-modal" role="dialog" >
<div class="modal-dialog modal-sm" style="margin-top: 12%" role="document">
<div class="modal-content" >
<div class="modal-header">
<h5 class="modal-title">Enter email address</h5>
<button type="button" class="close" data-dismiss="modal" (click)="onCancel()" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">

<div class="form-group">
<label for="name">Email</label>
<input type="email" class="form-control" [(ngModel)]="emailInput" required>

</div>
<span><button type="submit" class="btn btn-primary" data-dismiss="modal" (click)="onSubmitClick(emailInput)">Send invitation</button></span>

</div>
</div>
</div>
</div>
[code]