Angular 8: Как выполнить расчет по двум свойствам наблюдаемого объекта и необходимо сохранить другое свойство - PullRequest
3 голосов
/ 19 февраля 2020

Мне нужно показать сумму двух свойств наблюдаемых данных. Вот мой код Пожалуйста, посоветуйте мне, как это исправить.

Класс машинописи

export class Amount {
Amount1: number;
Amount2: number;
Total:number;
}

В службе машинописи:

Я объявил наблюдаемый объект

export class AmountService {    
 public newmessageService = new BehaviorSubject(new Amount());    
  public Model = this.newmessageService.asObservable();     
}

В классе компонентов:

подписал эту наблюдаемую модель в компоненте расчета

export class Calculation implements OnInit {    
Model$:Amount;     
  ngOnInit() {    
    this.service.Model.subscribe(temp => this.Model$ = temp)
  }
}

В представлении компонента:

В представлении свойства Amount1 и Amount2 объявлены для входных данных, и отображается итоговое значение.

  <form name="calculationform">

  <mat-form-field class="example-full-width">    
    <mat-label>Amount1</mat-label>    
    <input matInput [(ngModel)]="Model$.Amount1" name="Amount1">    
  </mat-form-field>

  <mat-form-field class="example-full-width">    
    <mat-label>Amount2</mat-label>    
    <input matInput [(ngModel)]="Model$.Amount2" name="Amount2">    
  </mat-form-field>

      <mat-label>Total:</mat-label>        
      <mat-label>{{Model$.Total}}</mat-label>
</form>

Мне нужно показывать сумму Amount1 и Amount2 в общей собственности при каждом изменении суммы.

Спасибо.

Ответы [ 2 ]

2 голосов
/ 19 февраля 2020

Можно рассмотреть преобразование свойства Total в геттер.

export class Amount {
  Amount1: number;
  Amount2: number;
  get Total():number {
    return this.Amount1 + this.Amount2;
  };
}
0 голосов
/ 19 февраля 2020

Пожалуйста, попробуйте

ngDoCheck( ){
   this.service.Model.subscribe(temp => {
      this.Model$ = temp;
      this.Model$.Total = Number(this.Model$.Amount1) + Number(this.Model$.Amount2);
   });
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...