Data not ready in time

I have a line of code which is triggered on the change of a radio button however I’m having to click twice on the radio button in order for the code to execute correctly

partyTypeChanged (index: number) {
  this.payAttributes[index].partyType = this.testForm.get('payReasons')['controls'][index].get('partyType').value;
}

HTML

  <form-radio
    formControlName="partyType"
    [formStatus]="testForm.formErrors.payReasons[i]"
    [parentFormGroup]="payReasonForm"
    [data]="{
      name: 'partyType',
      label: 'party type',
      options: [
        {
          name: individualThirdPartyValue,
          label: 'individual'
        },
        {
          name: entityThirdPartyValue,
          label: 'business'
        }
      ]
    }"
    (valueChanged)="partyTypeChanged(i)">
  </form-radio>

  <p *ngIf="payAttributes[i].partyType === individualPartyValue">individual</p>
  <p *ngIf="payAttributes[i].partyType === entityPartyValue">business</p>

I was able to get it to work with a setTimeout but I want to find out if anyone has an idea how else I can get it to work without using a setTimeout

This works

partyTypeChanged (index: number) {
  setTimeout(()=>{
    this.payAttributes[index].partyType = this.testForm.get('payReasons')['controls'][index].get('partyType').value;
  }, 3000); 
}