există vreo alternativă pentru ng-disabled în angular2? (Programare, Angular, Directivă Angular)

Bhushan Gadekar a intrebat.

Folosesc angular2 pentru dezvoltare și mă întrebam dacă există vreo alternativă pentru ng-disabled în angular2.

De ex. codul de mai jos este în 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>

Am vrut doar să știu Cum pot realiza această funcționalitate?orice contribuții?

Comentarii

    15

  • [disabled]=”!nextLibAvailable” încercați acest lucru ar putea ajuta –  > Por mayur.
5 răspunsuri
Günter Zöchbauer

Pentru a seta disabled la true sau false utilizați

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

Comentarii

  • Funcționează numai pe <button>, (este adevărat?) , ceea ce este rezonabil. În caz contrar, se primește mesajul de eroare (de exemplu, atunci când se încearcă să se lege la o proprietate <a>) ` Nu se poate lega la „disabled” deoarece nu este o proprietate cunoscută a lui „a” ` – –  > Por Mazăre Roșu.
  • Funcționează pe fiecare element care are un disabled proprietate. A se vedea, de asemenea, stackoverflow.com/questions/35431188/angular –  > Por Günter Zöchbauer.
Roger Gusmao
[attr.disabled]="valid == true ? true : null"

Trebuie să utilizați null pentru a elimina attr din elementul html.

Comentarii

  • Pentru angular > 2.x aceasta este calea corectă folosind [attr.disabled] –  > Por dale.
  • 15

  • attr. este necesară numai atunci când elementul nu are un element disabled proprietate. Pentru elemente precum butoanele și elementele de intrare attr. este redundant. Pentru elementele care nu au o proprietate disabled o legătură cu attr.disabled are sens doar dacă îl abordați prin CSS pentru a-l face să arate ca fiind dezactivat (pointerul mouse-ului, culori gri, …) –  > Por Günter Zöchbauer.
  • Da, aceasta este cea mai bună metodă atunci când o parte din elemente nu au o proprietate implicită „disabled”. –  > Por Viraj.
  • Puteți vedea o soluție aici – funcționează cu acest atribut în componentele dvs. HTML [attr.aria-disabled]="myPropReflectingIfDisabled". Se va adăuga un atribut aria-disabled="true" dacă myPropReflectingIfDisabled este true. –  > Por Netsi1964.
Aneeq Azam Khan

Aici este o soluție pe care o folosesc cu anular 6.

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

plus răspunsul dat mai sus

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

nu a funcționat pentru mine, plus să fie conștient de utilizarea null, deoarece se așteaptă bool.

Comentarii

  • [readonly]=”DateRelatedObject.bool_DatesEdit ? true : false” funcționează cu Angular 6+ –  > Por somedev.
Krishnadas PC

Pentru angular 4+ puteți încerca

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

Priya Gupta

Da, puteți seta [disabled]= „true” sau dacă este un buton radio sau o casetă de selectare, atunci puteți folosi pur și simplu disable

Pentru butonul radio:

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

Pentru dropdown:

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