angular2에서 입력을 비활성화하는 방법

is_edit = true비활성화하려면 ts 에서 ...

<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}]

여기 플런 커가 있습니다

간단히 할 수 있습니다.

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

일부 명령문에서 입력을 비활성화하려는 경우. 사용 [readonly]=true또는 false대신 사용할 수의.

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

<input [disabled]="is_edit" id="name" type="text">
<button (click)="is_edit = !is_edit">Change input state</button>

export class AppComponent {
  is_edit : boolean = false;
}

나는 당신이 false대신에 의미했다고 생각합니다'false'

또한, [disabled]을 기대하고있다 Boolean. 당신은 반환하지 않도록해야합니다 null.

위 의 fedtuck의 수락 된 답변 에 대한 Belter의 의견에 대한 답변 입니다.

이것은 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"/>

이 솔루션을 선호합니다

HTML 파일에서 :

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

TS 파일에서 :

dynamicVariable = false; // true based on your condition 

찾고있는 것은 disabled = "true" 입니다. 예를 들면 다음과 같습니다.

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

데모

is_edit부울 유형으로 만듭니다 .

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

export class App {
  name:string;
  is_edit: boolean; 
  constructor() {
    this.name = 'Angular2'
    this.is_edit = true;
  }
}

Angular 7에서 TextBox 비활성화

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

또한 입력 상자 / 버튼이 비활성화 상태로 유지되어야하는 경우 간단히 <button disabled>또는 <input disabled>작동합니다.

Select각도 9에서 비활성화 되었습니다.

boolean이 예제에서 값으로 비활성화 된 작업을 기억 하십시오. 국가가 선택되지 않은 경우 지역이 비활성화 (change)되는 select옵션 과 함께 이벤트를 사용하고 있습니다.

find.component.ts 파일

import { Component, OnInit } from '@angular/core';

@Component({
  selector: 'app-find',
  templateUrl: './find.component.html',
  styleUrls: ['./find.component.css']
})
export class FindComponent implements OnInit {
  isCountrySelected:boolean;

  constructor() { }
  //onchange event disabled false
 onChangeCountry(id:number){
   this.isCountrySelected = false;
 }
  ngOnInit(): void {
    //initially disabled true
    this.isCountrySelected = true;
  }

}

find.component.html

//Country select option
<select  class="form-control"  (change)="onChangeCountry()" value="Choose Country">
                    <option value="">Choose a Country</option>
                    <option value="US">United States</option>
                     
</select>
//region disabled till country is not selected 
<select class="form-control" [disabled]="isCountrySelected">
                    <option value="">Choose a Region</option>
                    <option value="">Any regions.</option>
                    
                </select>

간단하게 사용할 수 있습니다

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

나는 이렇게 얻었다. 그래서 선호합니다.