javascript - How to disable button in Angular if listarray is not empty? - Stack Overflow

admin管理员组

文章数量:1355710

In my ponent I'm getting data from my service:

ngOnInit() {
  this._sharedService.
    getReceiptItem().takeUntil(this.ngUnsubscribe).
    subscribe(products => this.receiptItems = products);
}

So how can I disable a button if my array this.receiptItems has any items?

I've tried something like this:

 <div class="top-left">
    <button [disabled]="receiptItems.count>0" type="button" [routerLink]="['/administration']"><i class="fas fa-bars fa-fw"></i></button>
 </div>

But obliviously that is not a solution..

Thanks

In my ponent I'm getting data from my service:

ngOnInit() {
  this._sharedService.
    getReceiptItem().takeUntil(this.ngUnsubscribe).
    subscribe(products => this.receiptItems = products);
}

So how can I disable a button if my array this.receiptItems has any items?

I've tried something like this:

 <div class="top-left">
    <button [disabled]="receiptItems.count>0" type="button" [routerLink]="['/administration']"><i class="fas fa-bars fa-fw"></i></button>
 </div>

But obliviously that is not a solution..

Thanks

• javascript
• html
• angular
• css-selectors
• angular-services

Share Improve this question Follow asked Jul 5, 2018 at 8:40 Roxy'ProRoxy'Pro 4,4641010 gold badges4949 silver badges120120 bronze badges

Add a ment  | 

4 Answers 4

Sorted by: Reset to default 4

You need Array.length in javascript

   <button [disabled]="receiptItems.length>0" type="button" [routerLink]="['/administration']"><i class="fas fa-bars fa-fw"></i></button>

Update your code with following:

<div class="top-left">
    <button [disabled]="receiptItems && receiptItems.length>0" type="button" [routerLink]="['/administration']"><i class="fas fa-bars fa-fw"></i></button>
 </div>

You can try with length

ponent.ts

receiptItems:Array<any>;
ngOnInit() {
  this._sharedService.
    getReceiptItem().takeUntil(this.ngUnsubscribe).
    subscribe(products => this.receiptItems = products);
}

ponent.html

<div class="top-left">
    <button [disabled]="receiptItems.length > 0" type="button" [routerLink]="['/administration']"><i class="fas fa-bars fa-fw"></i></button>
 </div>

<button *ngIf="receiptItems!=undefined" [disabled]="receiptItems.length>0" type="button" [routerLink]="['/administration']"><i class="fas fa-bars fa-fw"></i></button>

本文标签： javascriptHow to disable button in Angular if listarray is not emptyStack Overflow