javascript - 使用 Angular 6 有条件地显示和隐藏按钮

Question

实际上我正在尝试在任务运行时禁用该按钮。任务加载完成后，我想激活按钮。意味着当任务状态处于“进行中”时，同步图标会并行旋转，一旦状态更改为“已完成”，旋转器应隐藏，并且应激活“自动编码同步”按钮。那么如何实现这一目标。为此，我编写了以下代码:

<section *ngFor="let task of tasksRes">
    <nav>
        <span class="text-warning" *ngIf="task?.status == 'In_progress'"><i class="fa fa-spinner fa-spin"></i></span> 
    </nav>

    <div class="pull-right">
        <button mat-raised-button color="primary" (click)="open();" class="btn-w-md">
        AutoCode Sync
        </button>
    </div>
</section>

任何人都可以帮助我实现这一目标吗？谢谢。

Answer 1

根据您的条件(状态===已完成)使用 ngIf 来显示/隐藏按钮

<div class="pull-right">
    <button mat-raised-button color="primary" (click)="open();" class="btn-w-md" *ngIf="task?.status == 'Completed'"">
    AutoCode Sync
    </button>
</div>