Use async translations in TS code - parent components of CardComponent

[Platonn]

Example:

getCardContent({
    defaultPayment,
    accountHolderName,
    expiryMonth,
    expiryYear,
    cardNumber,
  }: PaymentDetails): Observable<Card> {
    return combineLatest([
      this.translation.translate('common.setAsDefault'),
      this.translation.translate('common.delete'),
      this.translation.translate('paymentMethods.deleteConfirmation'),
      this.translation.translate('paymentForm.expires', {
        month: expiryMonth,
        year: expiryYear,
      }),
    ]).pipe(
      map(
        ([
          textSetAsDefault,
          textDelete,
          textDeleteConfirmation,
          textExpires,
        ]) => {
          .....

          return card;
        }
      )
    );
  }

Note: add async pipe in the template:

<cx-card
              [border]="true"
              [fitToContainer]="true"
              [content]="getCardContent(paymentMethod) | async"   <===================
              (deleteCard)="deletePaymentMethod(paymentMethod)"
              (setDefaultCard)="setDefaultPaymentMethod(paymentMethod)"
              (editCard)="setEdit(paymentMethod)"
              [editMode]="editCard === paymentMethod.id"
              (cancelCard)="cancelCard()"
            ></cx-card>

[mirkosoft]

This ticket is for unblocking #1809