Изменение угла ngIf на экране загрузки

Question

на моем экране просмотра моя страница будет выглядеть следующим образом

для кнопки загрузки, я использую jspdf для создания файла PDFно он будет генерировать что-то вроде этого

И это один из моих примеров поля ввода

<div class="col-md-2">
    <label for="name">Name :</label>
</div>
<div class="col-md-6">
    <input mdbInputDirective [mdbValidate]="false" type="text" class="form-control" style="border:1px solid;"
    formControlName="address1" disabled>
</div>

Как можноЯ делаю, когда пользователь нажимает кнопку загрузки, он покажет кнопку загрузки (которую я сделаю сам), и содержимое страницы изменится на что-то вроде таблицы или чего-то еще, а в загруженном PDF-файле вместо этого будет показана таблица.показа поля ввода и после того, как экран загрузки закончится, он вернется на обычную страницу.

Answer 1

Обычной практикой размещения загрузчика в приложениях Angular является следующее.

TS

public loading: boolean = false;

public doDownload(): void {
    // Start downloading
    this.loading = true;
    // Do your work
    this.loading = false;
}

HTML

<div *ngIf="loading">Loader</div>
<div *ngIf="!loading">Content</div>

Вместо Загрузка сообщение, вы можете использовать загрузчик SVG или https://github.com/airbnb/lottie-web

Кроме того, убедитесь, что ваш детектор изменений автоматически повторно отображает DOM.