Có sự thay thế nào cho ng-khuyết trong angular2 không?

145

Tôi đang sử dụng angular2 để phát triển và đã tự hỏi nếu có bất kỳ sự thay thế nào cho ng-disabledangular2.

Dành cho người cũ mã dưới đây là trong 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>

Chỉ muốn biết Làm thế nào tôi có thể đạt được chức năng này? đầu vào nào?

angular angular-directive

— Bhushan Gadekar
nguồn

15

"! nextLibAvailable" [tắt] = thử này có thể giúp

— Mayur

278

Để đặt thuộc disabledtính truehoặc falsesử dụng

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

— Günter Zöchbauer
nguồn

5

Chỉ hoạt động trên <button>,(điều đó có đúng không?), Điều này là hợp lý. Khác nhận được thông báo lỗi (tức là khi cố gắng bám vào một <a>) `Không thể liên kết với 'disabled' vì nó không phải là một tài sản của 'a' 'nổi tiếng

— The Red Pea

4

Nó hoạt động trên mọi yếu tố có một disabledtài sản. Xem thêm stackoverflow.com/questions353431188/angular

— Günter Zöchbauer

69

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

Bạn phải sử dụng nullđể loại bỏ attr khỏi phần tử html.

— Roger Gusmao
nguồn

3

Đối với góc> 2.x, đây là cách chính xác bằng cách sử dụng [attr.disables]

— dale

12

attr.chỉ được yêu cầu khi phần tử không có thuộc disabledtính. Đối với các yếu tố như nút và yếu tố đầu vào attr.là dư thừa. Đối với các phần tử không có thuộc disabledtính, một ràng buộc attr.disabledchỉ có ý nghĩa nếu bạn xử lý nó bằng CSS để làm cho nó trông giống như bị vô hiệu hóa (con trỏ chuột, màu xám, ...)

— Günter Zöchbauer

Có, đây là cách tốt nhất khi một số thành phần không tắt mặc định thuộc tính.

— Viraj

Bạn có thể thấy một giải pháp ở đây - nó hoạt động với thuộc tính này trong các thành phần HTML của bạn [attr.aria-disabled]="myPropReflectingIfDisabled". Nó sẽ thêm một thuộc tính aria-disabled="true"nếu myPropReflectingIfDisabledcó true.

— Netsi1964

6

Đây là một giải pháp đang sử dụng với anular 6.

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

cộng với câu trả lời trên

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

đã không làm việc cho tôi cộng với ý thức về việc sử dụng null vì nó mong đợi bool.

— Aneeq Azam Khan
nguồn

[readonly] = "DateRelatedObject.bool_DatesEdit? true: false" hoạt động với Angular 6+

— somedev

4

Đối với các phiên bản 4+ góc cạnh, bạn có thể thử

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

— Máy tính cá nhân
nguồn

0

Có Bạn có thể đặt [vô hiệu hóa] = "đúng" hoặc nếu đó là nút radio hoặc hộp kiểm thì bạn chỉ cần sử dụng vô hiệu hóa

Đối với nút radio:

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

Đối với thả xuống:

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

— Priya Gupta
nguồn