Home > Software engineering >  How to change the [disabled] property of an Angular object
How to change the [disabled] property of an Angular object

Time:05-06

I would like to change the [disabled] property of the "app-box-ceding-company-definition" object; in the ts the property is set to true but I would like to change its value based on the outcome of a condition.

condition: selectrow.status == "01" => disabled = true

selectrow.status == "02" => disabled = false

here the statement:

<div>
<div style="float:left"><span><dx-text-box id="text_box" [ngStyle]="{'color': disabled ? 'darkgray': '' }" [disabled]="true" [(value)]="textValue"  style="opacity:0.9"></dx-text-box></span></div>
<div style="float:left"><button  id="box-ceding-company-definition.btnChoose" [ngStyle]="{'color': disabled ? 'darkgray': '' }" (click)="clearValues()">X</button></div>
<div style="float:left"><button  id="box-ceding-company-definition.btnClear" [ngStyle]="{'color': disabled ? 'darkgray': '' }" (click)="showPopup()">...</button></div>

here where I want to insert the condition (disabled="true"):

<div >
        <div  *ngIf="selectedAgreement.cateSector != 'AC'"><label>{{'agreement_tab_definition_lbl_ceding_company'  | translate}}</label></div>
        <div  *ngIf="selectedAgreement.cateSector == 'AC'"><label>{{'agreement_tab_definition_lbl_ceding_company_sotto'  | translate}}</label></div>
        <div > <app-box-ceding-company-definition id="definition-tab-agreement.defiCedingComp" [textValue]="selectedAgreement.defiCedingComp"  (notifyPopup)="receiveEmitPopup($event)" disabled="true" (emitFullValue)="recieveCedingCompany($event)"></app-box-ceding-company-definition>
        </div>
    </div>

CodePudding user response:

you put a fixed [disabled]="true" . Try replace true to your condition.

[disabled]="selectrow.status == '01'" // if true disable ON
  • Related