Angular Conditional Readonly/Disable on Input Fields

Angular conditional readonly/disable on input fields

You could declare a variable that identifies the size of the array that comes from backend (like initialArraySize), then when you add a new row you verify if the index of that row is greater than the initial array size, if its true, you make it editable..

<tbody>
<tr *ngFor="let data of userList; let index = index">
<td> <input class="form-control" type="text" id="userListName" [(ngModel)]="userList[index].name"
name="userListName{{index}}" [readonly]="index >== initialArraySize"/></td>
</tr>
</tbody>

Conditionally make input field readonly in Angular 2 or 4: Advice + Best/which way to do it

You need to use the following (Angular 4):

<input [readonly]="isReadOnly">

If you use att.readonly then the input will always be read-only because the readonly attribute will be present even if its value is false. By using [readonly] Angular will only place the attribute if isReadOnly is true.

In HTML, the following is sufficient to cause an input to be read-only:

<input readonly>

Disable Angular 5 Input fields correct way

You can change the assignment of the variable to a setter method so that you'd have:

set isDisabled(value: boolean) {
this._isDisabled = value;
if(value) {
this.form.controls['name'].disable();
} else {
this.form.controls['name'].enable();
}
}

How to make readonly all inputs in some div in Angular2?

Try this in input field:

[readonly]="true"

Hope, this will work.

How to make select dropdown readonly or disabled conditionally in angular?

You should use disabled instead of attr.disabled

<select [disabled]="!editable">
...
</select>

How to disable a input in angular2

Try using attr.disabled, instead of disabled

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

How to make checkbox disabled on condition in angular?

Try like this:

<input type="checkbox" [disabled]="item.active == 'N'">


Related Topics



Leave a reply



Submit