использование значения из выбора в реактивной форме - Angular - PullRequest
0 голосов
/ 08 мая 2020

Я хочу использовать значение из выбранного значения, я хочу использовать атрибуты из этого объекта для использования в качестве минимального и максимального значения. С помощью метода, который я сейчас пытаюсь использовать, минимальные и максимальные значения не обновляются, когда я выбираю категорию

<form [formGroup]="brewingMethod" (ngSubmit)="onSubmit()">
      <mat-form-field>
        <input
          matInput
          aria-label="name"
          placeholder="name"
          type="text"
          formControlName="name"
          required
        />
      </mat-form-field>
      <br>
      <mat-form-field>
        <mat-select
          aria-label="category"
          formControlName="category"
          placeholder="category"
        >
          <mat-option
            *ngFor="let category of (categories$ | async)"
            [value]="category"
          >
            {{ category.name }}
          </mat-option>
        </mat-select>
      </mat-form-field>
        <p>temperature(°C): </p>
        <mat-slider  min="{{brewingMethod.get('category')['minTemperature']}}"  max="{{brewingMethod.get('category')['maxTemperature']}}" step="0.5" value="{{brewingMethod.get('category')}}" thumbLabel tickInterval="1" valueLabelDisplay="on"></mat-slider>
        <p>ratio(g/L): </p><br>
        <input
          formControlName="ratio"
          aria-label="ratio"
          placeholder="ratio"
          type="range"
          min="{{brewingMethod.get('category')['minRatio']}}"
          max="{{brewingMethod.get('category')['maxRatio']}}"
          required
        /><br>
        <p>grindSize:</p>
        <input
          formControlName="grindSize"
          aria-label="grind size"
          placeholder="grind size"
          type="range"
          min="{{brewingMethod.get('category')['minGrindSize']}}"
          max="{{brewingMethod.get('category')['maxGrindSize']}}"
          required
        />
        <mat-error
          *ngIf="
            brewingMethod.get('name')['errors']?.required &&
            brewingMethod.get('name').touched
          "
        >
        {{ getErrorMessage(brewingMethod.get("name")["errors"]) }}
      </mat-error>
      <br>
      <button
        type="submit"
        mat-raised-button
        [disabled]="!brewingMethod.valid"
      >
        add brewing method
      </button>
    </form>

Категория содержит минимальное и максимальное значения, которые мне нужны в ползунке диапазона, когда я выбираю категорию ползунки диапазона не обновляются

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...