Angular 6 - невозможно отключить текстовое поле ввода
Я хотел бы отключить текстовое поле, когда установлен флажок. Проблема в том, что я даже не могу отключить его без каких-либо условий.
Это мой HTML:
<label for = "checkbox-inline">
<input type = "checkbox" class = "checkbox other" name = "others" value = "15"
#goodsOthersChk (change) = "onCheckArray($event, Form.value.goods)">
<p class = "otherText"> Others:</p>
<input id = "goodsOthers" name = "goodsOthers"
formControlName = "goodsOthers" type = "text" value = ""
class = "form-control otherInput" size = "30%" [disabled] = "isDisabled">
</label>
мой компонент .ts:
export class GoodsComponent implements OnInit {
isDisabled = true;
}
Я не вижу, чего мне не хватает. Когда я проверяю текстовое поле, у него есть свойство ng-reflect-is-disabled, для которого установлено значение true, но оно не отражается на моей странице.
@PranavCBalan я воспроизвел, и он работает, как и ожидалось, но не на моей странице.
проблема связана с чем-то другим в вашем коде.... поделитесь полным кодом
Я вижу директиву formControlName на нем. Свойство [disabled] не будет работать с реактивными формами. Вместо этого используйте свойство disabled в FormControl в TypeScript.
@cristian.t правильно. Вы не должны использовать свойство [disabled] для отключения элемента управления формы с помощью реактивных форм. В настоящее время он выдает предупреждение в консоли, позже это будет считаться устаревшим и выдавать ошибки.
Я имею в виду, я буквально угадываю. Трудно сказать, что происходит, мы видим только небольшой фрагмент реального кода.
Ответы 1
Я думаю, это потому, что вы используете реактивные формы. Теоретически вы можете использовать атрибут disabled, но способ работы с реактивной формой будет заключаться в установке свойства disabled при инициализации FormGroup.
yourFrom: FormGroup = this.formBuilder.group({
goodsOthers: [{ value: null, disabled: true }],
.
.
// other Form controls
})
привет это работает. Спасибо! Кстати, я хотел бы переключаться между отключением и включением текстового поля с помощью флажка. как я могу это сделать, если у меня есть более одного текстового поля, к которому мне нужно применить его? я могу сделать это для одного, но не совсем уверен, как сделать это для более чем одного
Пожалуйста! Понимаю. Каждое текстовое поле «подключено» к своему отдельному флажку? Или вы используете этот единственный флажок для переключения отключенного атрибута всех текстовых полей?
@mhfour Я свяжусь с вами вскоре после окончания рабочего дня.
Привет, я только что вспомнил об этом и мне было интересно, есть ли способ сделать это?
@mhfour Извините за поздний ответ. Думали ли вы сгруппировать ввод и соответствующий ему флажок в FormGroup?
Вы имеете в виду, что каждый ввод и его флажок должны быть сгруппированы в свою собственную группу форм? на данный момент все находится в одной FormGroup
@mhfour Вскоре я опубликую короткий фрагмент своего ответа. Просто чтобы проверить, сколько из этих пар ввода/флажка есть в вашей форме?
у меня есть несколько форм, и они варьируются от формы к форме. не менее 5 на форму
здравствуйте, вы можете опубликовать фрагмент?