ngx-loading-this.loading = false

Question

我在HTML中使用ngx-loading，this.loading = true与sendMail（）函数配合正常，但是由于某些原因，成功消息后，加载器不会消失，好像它无法识别出这个一样。假。任何帮助将不胜感激，因为我不明白这里出了什么问题。

<div class="card-reinfort"> <ngx-loading [show]="loading" [config]="{ backdropBorderRadius: '3px' }"></ngx-loading></div>

和组件：

@Component({
changeDetection: ChangeDetectionStrategy.OnPush,
selector: 'ma-reinforcement',
templateUrl: './reinforcement.component.html'
})
export class ReinforcementComponent {
loading = false;
reinforcementList$: Observable<Array>;
@ViewChild(ReinforcementTableComponent, { static: false }) table: 
ReinforcementTableComponent;

constructor(private readonly reinforcementService: ReinforcementService, private readonly 
toastrService: ToastrService) {
this.reinforcementList$ = this.reinforcementService.getAll();
}

onSaveEvent(reinforcementItem: ReinforcementItem): void {
this.reinforcementList$ = this.reinforcementService.save(reinforcementItem);
}

sendMail(): void {
this.loading = true;
this.reinforcementService.sendMail('Export du renfort sur la ligne de caisse', 'Message')
    .subscribe(result => {
        this.loading = false;
        this.toastrService.success('L\export a bien été envoyé', 'Success');
    },
        error => {
            this.toastrService.error('L\'email n\'a pas été envoyé', 'Erreur');
        }
    );

    }
   }

Answer 1

仅在*ngIf="loading"为真时才添加loading以显示它。

尝试这样：

<ngx-loading *ngIf="loading" [show]="loading" [config]="{ backdropBorderRadius: '3px' }"></ngx-loading>

Answer 2

通过添加this.ref.detectChanges（）修复了此问题；之后this.loading = false