Отключение элемента управления Select Form в Reactive Forms/Angular 4+

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

<select id="locationScanType" class="form-control" formControlName="locationScanType">                     
  <option value="0">-- Select One --</option>
  <option value="FACILITY">Facility</option>
  <option value="CUSTOMER_LOCATION">Customer Location</option>
  <option value="MY_LOCATION">My Location</option>
</select>

<input type="text" class="form-control" formControlName="textInput" />

В моей функции ngOnInit() я делаю это:

this.stopForm = this._formBuilder.group({
  locationScanType: { value: this.stop.locationScanType, disabled: true }, // Hard code true for demo
  textInput: { value: 'Text Input', disabled: true }
});

Атрибут disabled работает для ввода текста, но не для ввода выбора. Он выбирает правильное значение для выбранного входа, но не отключает его. Я упускаю что-то очевидное?

Я могу отключить ввод выбора, используя атрибуты [attr.disabled] и/или [ngClass] для ввода выбора, но я бы предпочел сделать это в построителе форм; не говоря уже о том, что если я этого не сделаю, Angular выдает предупреждение в консоль моего браузера.

typescript: 2.4.2

@angular/core: 5.1.3

@angular/forms: 5.2.0


typescript angular angular-reactive-forms disabled-control
person amoyer    schedule 29.03.2018    source источник
comment
Есть ли где-нибудь в вашем коде, что вы включаете выбор программно?   -  person ShellNinja    schedule 29.03.2018
comment
Нет, нет. Единственное, что позволяет его включить, это если это определенный тип стопа, но я убедился, что этот код работает как задумано, и он работает.   -  person amoyer    schedule 29.03.2018

Ответы (1)


arrow_upward
2
arrow_downward

вы можете использовать функцию отключения, которая предоставляет класс FormControl. как только вы создали форму, вы можете вызвать эту функцию в конкретном элементе управления формой

this.stopForm = this._formBuilder.group({
  locationScanType: { value: this.stop.locationScanType }, // Hard code true for demo
  textInput: { value: 'Text Input', disabled: true }
});

this.stopForm.get("locationScanType").disable()
person Ricardo    schedule 29.03.2018
comment
я с той же проблемой - person Pedro Tainha; 11.03.2019