Я пытаюсь добавить модал из начальной загрузки в мой код, и я использую Angular2 + (6 точно) для передней части.Проблема в том, что кнопка, которую я использую для вызова модального режима, находится в другом компоненте, чем сам модальный, поэтому она не работает должным образом.
В одном компоненте, Siderbar, у меня есть эти строки кода:
<li *ngIf="!userService.mainUser" data-toggle="modal" data-target="#login" style="cursor: pointer">
<a>
<i class="mdi mdi-login"></i>
<span class="hide-menu">Se connecter</span>
</a>
</li>
Как вы можете видеть, у меня есть data-toggle="modal"
и data-target="#login"
в моем <li>
, чтобы открыть мой мод, когда я нажимаю.
Проблема в том, что моймодальный код находится в другом компоненте, логин:
<div id="login" class="modal fade" role="dialog">
<div class="modal-dialog modal-dialog-centered">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-title">
<h1 style="margin-left: 15px">Se connecter</h1>
</div>
<div class="modal-body">
<div class="form-group">
<label class="form-control-label">Nom d'utilisateur</label>
<input name="username" class="form-control" placeholder="Nom d'utilisateur">
</div>
<div class="form-group">
<label class="form-control-label">Mot de passe</label>
<input name="password" class="form-control" placeholder="Mot de passe">
</div>
<div>
<input style="display: inline" type="checkbox">
<label style="margin-left: 10px"> Rester connecté ?</label>
</div>
<button (click)="logIn()" [ngStyle]="{'background': appFade, 'color': getTextColor()}">Se connecter</button>
</div>
</div>
</div>
</div>
Поэтому, когда я нажимаю кнопку «Se connectc», он не открывает мой модал, и я не знаю, как это сделатьработает.
Надеюсь, мой вопрос ясен и вы сможете мне помочь.Спасибо!