is there any alternative for ng-disabled in angular2?

AngularAngular Directive

Angular Problem Overview


I am using angular2 for development and was wondering if there is any alternative for ng-disabled in angular2.

For ex. below code is in angularJS:

<button ng-disabled="!nextLibAvailable" ng-click="showNext('library')" class=" btn btn-info btn-xs" title="Next Lib >> {{libraries.name}}">
    <i class="fa fa-chevron-right fa-fw"></i>
</button>

Just wanted to know How can I achieve this functionality? any inputs?

Angular Solutions


Solution 1 - Angular

To set the disabled property to true or false use

<button [disabled]="!nextLibAvailable" (click)="showNext('library')" class=" btn btn-info btn-xs" title="Next Lib"> {{libraries.name}}">
    <i class="fa fa-chevron-right fa-fw"></i>
</button>

Solution 2 - Angular

[attr.disabled]="valid == true ? true : null"

You have to use null to remove attr from html element.

Solution 3 - Angular

Here is a solution am using with anular 6.

[readonly]="DateRelatedObject.bool_DatesEdit ? true : false"

plus above given answer

[attr.disabled]="valid == true ? true : null"

did't work for me plus be aware of using null cause it's expecting bool.

Solution 4 - Angular

For angular 4+ versions you can try

<input [readonly]="true" type="date" name="date" />

Solution 5 - Angular

Yes You can either set [disabled]= "true" or if it is an radio button or checkbox then you can simply use disable

For radio button:

<md-radio-button disabled>Select color</md-radio-button>

For dropdown:

<ng-select (selected)="someFunction($event)" [disabled]="true"></ng-select>

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionBhushan GadekarView Question on Stackoverflow
Solution 1 - AngularGünter ZöchbauerView Answer on Stackoverflow
Solution 2 - AngularRoger GusmaoView Answer on Stackoverflow
Solution 3 - AngularAneeq Azam KhanView Answer on Stackoverflow
Solution 4 - AngularKrishnadas PCView Answer on Stackoverflow
Solution 5 - AngularPriya GuptaView Answer on Stackoverflow