点击输入后，弹出窗口关闭

Question

我想创建一个用于登录的弹出窗口 我曾经尝试过使用bootstrap droppdown和droppdown-toggle进行尝试，但是当我单击Login按钮打开时，当我单击两个文本框中的任何一个以输入登录详细信息时，它将关闭

 <div id="droppdown" class="dropdown" >
      <button class="dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true"
        aria-expanded="true" style="border: none;cursor: pointer;
        background: #FFF;color: #595959;" (click)="openLoginPopup()">  
        LOGIN
      </button>

      <ul id="dropdownMenu" class="dropdown-menu form-content" aria-labelledby="dropdownMenu1"
        style="border-radius:0px;padding: 0px;border:none;">
        <form [formGroup]="loginForm" role="form" #frmLogin="ngForm" id="frmLogin " style="padding:30px">
          <li>
            <mat-form-field class="width">
              <input type="text" matInput placeholder="Username*" formControlName="username" class="form-control"
                [(ngModel)]="UserName">

            </mat-form-field>
          </li>
          <li>
            <mat-form-field class="width">
              <input type="password" matInput placeholder="Password*" formControlName="password" class="form-control"
                [(ngModel)]="Password">

            </mat-form-field>
          </li>
          <li>
            <a id="lnkForgotPassword" class="forgot_username " style="color:#706f6f!important"
              (click)="navigateToForgotPassword()" style="cursor:pointer">Reset your
              password</a>
          </li>
          <li style="margin-bottom: 10px;margin-top: 5px;">
            <a id="lnkRegister" class="forgot_username " style="color:#706f6f!important" (click)="navigateToRegister()"
              style="cursor:pointer">Register</a>
          </li>
        </form>
        <button type="submit" name="go" class="btn login_button" [disabled]="!frmLogin.valid" (click)="onLoginClicked()"
          style="border-radius:0px">Login</button>

      </ul>
    </div>