Ответ 1
Попробуйте использовать attr.disabled
вместо disabled
<input [attr.disabled]="disabled ? '' : null"/>
В ts is_edit = true
отключить...
<input [disabled]="is_edit=='false' ? true : null" id="name" type="text" [(ngModel)]="model.name" formControlName="name" class="form-control" minlength="2">
Я просто хочу отключить ввод на основе true
или false
.
Я пробовал следующее:
[disabled]="is_edit=='false' ? true : null"
[disabled]="is_edit=='true'"
[disabled]="is_edit"
Попробуйте использовать attr.disabled
вместо disabled
<input [attr.disabled]="disabled ? '' : null"/>
Я думаю, что я понял проблему, это поле ввода является частью реактивной формы (?), так как вы включили formControlName
. Это означает, что то, что вы пытаетесь сделать, отключив поле ввода с помощью is_edit
, не работает, например, ваша попытка [disabled]="is_edit"
, которая в других случаях будет работать. С вашей формой вам нужно сделать что-то вроде этого:
toggle() {
let control = this.myForm.get('name')
control.disabled ? control.enable() : control.disable();
}
и вообще потерять is_edit
.
если вы хотите, чтобы поле ввода было отключено по умолчанию, вам необходимо установить элемент управления формой как:
name: [{value: '', disabled:true}]
Здесь plunker
Вы могли бы просто сделать это
<input [disabled]="true" id="name" type="text">
<input [disabled]="isDisabled()" id="name" type="text">
export class AppComponent {
name:string;
is_edit : boolean = false;
isDisabled() : boolean{
return this.is_edit;
}
}
Если вы хотите отключить ввод для некоторого оператора. используйте [readonly]=true
или false
вместо отключенного.
<input [readonly]="this.isEditable"
type="text"
formControlName="reporteeName"
class="form-control"
placeholder="Enter Name" required>
Я предполагаю, что вы имели в виду false
вместо 'false'
Кроме того, [disabled]
ожидает a Boolean
. Вам следует избегать возврата null
.
То, что вы ищете, это disabled = "true" . Вот пример:
<textarea class="customPayload" disabled="true" *ngIf="!showSpinner"></textarea>
Заметка в ответ на комментарий Белтера принятый ответ fedtuck выше, поскольку мне не хватает репутации для добавления комментариев.
Это неверно для любого из которых я знаю, в соответствии с Документы Mozilla
disabled равно true или false
Когда атрибут disabled присутствует, элемент отключается независимо от значения. См. этот пример
<input placeholder="i can be changed"/>
<input disabled placeholder="i can NOT be changed"/>
<input disabled="true" placeholder="i can NOT be changed"/>
<input disabled="false" placeholder="i can NOT be changed"/>
Отключить TextBox в Angular 7
<div class="center-content tp-spce-hdr">
<div class="container">
<div class="row mx-0 mt-4">
<div class="col-12" style="padding-right: 700px;" >
<div class="form-group">
<label>Email</label>
<input [disabled]="true" type="text" id="email" name="email"
[(ngModel)]="email" class="form-control">
</div>
</div>
</div>
</div>
Я предпочитаю это решение
В HTML файле:
<input [disabled]="dynamicVariable" id="name" type="text">
В файле TS:
dynamicVariable = false; // true based on your condition
введите is_edit
типа boolean.
<input [disabled]=is_edit id="name" type="text">
export class App {
name:string;
is_edit: boolean;
constructor() {
this.name = 'Angular2'
this.is_edit = true;
}
}
А также, если поле ввода/кнопка должны оставаться отключенными, тогда просто <button disabled>
или <input disabled>
.
можно использовать просто как
<input [(ngModel)]="model.name" disabled="disabled"
Я так понял. так что я предпочитаю.