Как отключить ввод в angular2

В 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"

Ответ 1

Попробуйте использовать attr.disabled вместо disabled

<input [attr.disabled]="disabled ? '' : null"/>

Ответ 2

Я думаю, что я понял проблему, это поле ввода является частью реактивной формы (?), так как вы включили 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

Ответ 3

Вы могли бы просто сделать это

<input [disabled]="true" id="name" type="text">

Ответ 4

<input [disabled]="isDisabled()" id="name" type="text">

export class AppComponent {
  name:string;
  is_edit : boolean = false;


 isDisabled() : boolean{
   return this.is_edit;
 }
}

Ответ 5

Если вы хотите отключить ввод для некоторого оператора. используйте [readonly]=true или false вместо отключенного.

<input [readonly]="this.isEditable" 
    type="text" 
    formControlName="reporteeName" 
    class="form-control" 
    placeholder="Enter Name" required>

Ответ 6

Я предполагаю, что вы имели в виду false вместо 'false'

Кроме того, [disabled] ожидает a Boolean. Вам следует избегать возврата null.

Ответ 7

То, что вы ищете, это disabled = "true" . Вот пример:

<textarea class="customPayload" disabled="true" *ngIf="!showSpinner"></textarea>

Ответ 8

Заметка в ответ на комментарий Белтера принятый ответ 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"/>

Ответ 9


Отключить 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>

Ответ 10

Я предпочитаю это решение

В HTML файле:

<input [disabled]="dynamicVariable" id="name" type="text">

В файле TS:

dynamicVariable = false; // true based on your condition 

Ответ 11

Демо

введите 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;
  }
}

Ответ 12

А также, если поле ввода/кнопка должны оставаться отключенными, тогда просто <button disabled> или <input disabled>.

Ответ 13

можно использовать просто как

     <input [(ngModel)]="model.name" disabled="disabled"

Я так понял. так что я предпочитаю.