Estoy haciendo una aplicación de cálculo de distancia usando angular que tiene,

Html:

<form [formGroup]="form" *ngIf="showForm">
<div formArrayName="distance" >
<table>
  <thead>
      <th> From Distance (Km) </th>
      <th> To Distance (Km) </th>
      <th> Fare Per Kilometer </th>
    </thead>
    <tbody>
    <tr 
      *ngFor="let item of form.get('distance').controls; let i = index" 
      [formGroupName]="i">
      <td>
      <input type="number" 
        placeholder="From" 
        formControlName="from">
        </td>
      <td>
        <input type="number"
          placeholder="To" 
          formControlName="to">
      </td>
       <td>
        <input type="number"
          placeholder="Fare Per Km" 
          formControlName="farePerKm">
      </td>
     </tr>
    </tbody>
   </table>
  </div>
</form>

TS:

  selectedValues(e) {
    this.showForm = true;
    this.form = this.fb.group({
      distance: this.fb.array([]),
    });
    const control = this.form.controls.distance as FormArray;
    if (e.target.value === "V1") {
      this.vehicleOne.forEach(data => {
        control.push(this.fb.group({
          from: [data.from, Validators.required],
          to: [data.to, Validators.required],
          farePerKm: [data.farePerKm, Validators.required]
        }));
      });
    }
    else if (e.target.value === "V2") {
      this.vehicleTwo.forEach(data => {
        control.push(this.fb.group({
          from: [data.from, Validators.required],
          to: [data.to, Validators.required],
          farePerKm: [data.farePerKm, Validators.required]
        }));
      });
    }
  }

El código anterior es solo para referencia, el código completo está aquí en ejemplo de trabajo https: //stackblitz.com/edit/disable-group-control-value-on-another-control-value-for-itrxa

Requisito En este ejemplo, puede ver que inicialmente hay un menú desplegable de selección que muestra elegir un vehículo, al elegir cualquiera de los dos vehículos obtendrá la tarifa por kilómetro para el vehículo en función de la base de y a km en una tabla.

Después de esta tabla hay un menú desplegable de tres que diceDesde la ubicación, a la ubicación, distancia total recorrida y un cuadro de entrada vacío dicetarifa tota.

Thing estoy en la necesidad es si el usuario seleccionaVehicle One(vehicle), Location A (From Location), Location C (To Location), 20KM (Total Distance travelled) entonces la entrada de tarifa total debe actualizarse con el valor de 350.

e acuerdo con la selección anterior (donde la distancia total recorrida fue 20Km en el vehículo uno) el cálculo será,

Para elprimeros 5 KMS (0-5), la tarifa es de 10 / km así que 5 * 10 = 50, donde paraSiguiente 15 KMS (6 a 20) la tarifa es de 20 / km así que 15 * 20 = 300.

Así que la tarifa total fue 50 + 300 = 350

El escenario dado anteriormente es solo, por ejemplo, y así, si elijo el segundo vehículo, entonces la tarifa debe calcularse de acuerdo con la división de km y la tarifa / km.

Si la selección fue como se indicó anteriormente, el valor de entrada de tarifa total,

<input type="number"
          placeholder="Fare Per Km" 
          formControlName="farePerKm">

necesita actualizarse con el valor calculado anterior de 350 según el ejemplo anterior, que varía según la selección.

Editar Por favor, no se preocupe por la estructura dada porque en mi aplicación real estoy usando mapas para calcular la distancia recorrida, lo he hecho todo dentro del formulario ahora.

Solo requisito es necesario obtener el valor total de la tarifa de la distancia total recorrida por un conductor en un vehículo que tiene el cálculo de la tarifa escupida en función del km como se indica.

El siguiente es el vehículo uno dividido. Entonces, si viajo en este vehículo uno durante 20 km, entonces la tarifa total debe ser de 350 (por ejemplo) para cualquier otro vehículo diferente dividido.

From Distance (Km)  To Distance (Km)    Fare Per Kilometer

0                    5                   10

6                    20                  20