Как я могу получить значение от службы к компоненту? - PullRequest
Новая
       23

Как я могу получить значение от службы к компоненту?

0 голосов
/ 08 апреля 2020

Мне нужно получить currentBalance от currentAccount, но я получаю сообщение об ошибке:

Ошибка: ошибка (в обещании): TypeError: Невозможно прочитать свойство 'currentAccount' из неопределенного.

Я могу отобразить баланс в моем HTML файле, используя {{currentAccount.currentBalance}}, но возвращается как неопределенный, когда я включаю его в функцию. Моя функция работает отлично, если я заменяю баланс на число c, просто не работает с currentBalance.

Вот мой код в файле TS: 

import { Component, OnInit, Input} from '@angular/core';
import { FormControl, FormGroup, Validators, ValidatorFn, FormBuilder, AbstractControl, ValidationErrors } from '@angular/forms';
import { ICustomerAccount } from 'src/app/customer/interfaces';
import { CustomerService } from 'src/app/customer/services/customer.service';
import { WireErrorComponent } from '../wire-error/wire-error.component';

@Component({
  selector: 'app-wire-start',
  templateUrl: './wire-start.component.html',
  styleUrls: ['./wire-start.component.scss']
})

export class WireStartComponent implements OnInit{
  @Input() currentAccount: ICustomerAccount;
  currentBalance: string;
  maxAmount = 1000000;

  constructor(private dialog: MatDialog,
              private _customerService: CustomerService,
              private formBuilder: FormBuilder
              ) { }

    wireStartForm: FormGroup = this.formBuilder.group({
    purpose: new FormControl('', Validators.required),
    amount: ['', [Validators.max(this.maxAmount), this.customValidatorFn]]
  });

  customValidatorFn(control: AbstractControl): { [key: string]: any } | null {
    const amount: number = control.value;
    const balance: number = Number(this.currentAccount.currentBalance);
    if (balance >= amount) {
      return null;
    } else {
      return {'amountMinError': true}
    }
  }

  ngOnInit(): void {
    this.currentAccount = this._customerService.getSelectedAccount();
  }
}

Ответы [ 2 ]

0 голосов
/ 08 апреля 2020

контекст this в пользовательском валидаторе отличается. Попробуйте использовать функцию arrrow, которая устанавливает context из this в класс. 

customValidatorFn = (control: AbstractControl): { [key: string]: any } | null =>{
    const amount: number = control.value;
    const balance: number = Number(this.currentAccount.currentBalance);
    if (balance >= amount) {
      return null;
    } else {
      return {'amountMinError': true}
    }
  }

Вот рабочий пример: Демо

0 голосов
/ 08 апреля 2020

Поскольку вы берете значение currentAccount в качестве Входа для компонента, поэтому при связывании значения из службы будет возвращаться значение должным образом, но для currentAccount может быть задан набор данных из Input ()

Попробуйте установить данные currentAccount из службы из компонента, из которого вызывается компонент app-wire-start (т. Е. Из родительского компонента), и передать данные службы в качестве входных данных в app-wire-start компонент типа

<app-wire-start [currentAccount]="currentAccountFromService"></app-wire-start>

...