Компонент дублируется - PullRequest
0 голосов
/ 29 мая 2020

У меня проблема, когда мой компонент, который я пытаюсь использовать повторно, дублируется. Итак, это наложение, но оно отображается дважды, один поверх другого. Вот мой код.

оверлей. html

<div *ngIf="isHelpTips" id="parent" >
  <div class="small-modcontainer">
    <div class="grid grid-cols-1 step">
      <div class="bg-black small-top-header relative shadow-md">
        <div class="are-you-sure">
        <div class="text-left font-sans">
            <span class="font-hairline ml-2 text-3xl text-white">{{subtext}} </span>
        </div>
          <div class="text-left font-sans">
            <span class="font-hairline ml-2 text-3xl text-white">{{subtext1}}</span>
          </div>
        </div>
      </div>
      <div class="bg-white small-content relative shadow-md">
        <div> 
          <div class="flex flex-row mt-10">
            <div>
              <div class="mt-8" >
                <span class="font-light ml-10 text-2xl text-black">{{header1}} </span>
              </div>
              <div>
                <div class="font-light ml-10 mt-1 text-base text-black">{{info1}} </div>
              </div>
              <div>
                <div class="font-light ml-10 mt-1 text-base text-black">{{info2}} </div>
              </div>
            </div>
           </div>
        </div>
        <div class="flex flex-row mr-4 float-right">
          <button  (click)="isHelpTips = false" class="bg-orange-500 orange-btn font-semibold mt-4 mr-12 w-2/5 text-sm shadow-md text-center right-0 p-2 rounded-full text-white uppercase cursor-pointer">continue</button>
        </div>
      </div>
    </div>
  </div>
</div>

overlay.ts

isHelpTips: boolean = true;

второй компонент. html

<app-continue-warning
  subtext="Before we show you your savings,"
  subtext1="it's important that you note the following:" 
  header1="Broker details"
  info1="The details of the broker to receive your transfer. You should ask HR for the details of the broker at your new employer."
  header2="Banking details"
  info2="Your banking details, including your bank name, account number and account type.">
</app-continue-warning>

Когда я нажимаю кнопку «Продолжить», одно наложение уходит, но другое остается видимым

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...