how to disable button in angular

Question

i want to disable a button with this code, i always have 'deletable' variable binding with the value true to the html.

this is the component :

 public deletable: boolean = true;
 public ngOnInit() {
        this.getDetailLoading();
        this.user = this.currentUserService.getCachedCurrentUser();
         console.log('ngOnInit',this.deletable); // true on the console
 }

 public getDetailLoading(): void {
        this.subscriptionGetDetailChargement = this.planificationChargementService
            .getDetailDemandeChargement(+this.route.snapshot.paramMap.get('id')).subscribe(
            (data) => {
                this.data = data;
                this.setDeletable(); //
                console.log('getDetailLoading',this.deletable); false on the console
            },
            (error) => {
                this.toastService.update(ToastService.TYPE_ERROR,
                    'Une erreur est survenue lors de la récupération des données.');
            });
    }

and here is the template html :

<div style="display: inline; float: right;">
    <bdf-ng-button role="button" buttonType="button" [disabled]="!user.isSupervisor() && !deletable" type="medium" label="supprimer"
        (click)="openPopInDelete()"></bdf-ng-button>
</div>

the value false calculated when the service responds is not binded to the template please how can i solve this please?