How to check for an empty string in typescript

Question

I have the following class

export class PracticeQuestionsListAPI {
  'list':UserOverview[];
  'page-info':string;
  constructor(public pageState:string, public usersList:UserOverview[]){
    this['page-state'] = pageState;
    this['users-list'] = usersList;
  }
}

In my Angular's component's HTML, I want to show a button only if page-state is not an empty string. How could I do it?

I have written something like this but it doesn't compile.

<button *ngIf="!this.users['page-state'].isEmpty()" (click)="getNextPage()" id="next-page-button" class="btn content-div__button--blue btn-sm">Next Page</button>

I also tried *ngIf="!(this.questions['page-state'] =="")" but that doesn't compile either

Why do you make your own life difficult by choosing variable names containing a dash, and not respecting standard naming conventions? Use pageInfo, not page-info. Use users, not users-list. Use pageState, not page-state. And declare the properties you're using. Then simply use *ngIf="pageState", or if you really want to accept null and undefined, but not the empty string, use *ngIf="pageState !== ''". — JB Nizet
– JB Nizet, Commented Jul 15, 2018 at 9:42
Reason to chose dash is these variables map to json data Received from server. I have pageInfo variable as well. I will use that and see if it works — Manu Chadha
– Manu Chadha, Commented Jul 15, 2018 at 9:44
You can just use like this *ngIf="!this.users['page-state']", It will check empty, null and undefined. — hrdkisback
– hrdkisback, Commented Jul 16, 2018 at 6:27

Roopesh Kumar Ramesh · Accepted Answer · 2018-07-16 05:27:43Z

2

this should work fine

<button *ngIf="this.users['page-state'].length>0" (click)="getNextPage()" id="next-page-button" class="btn content-div__button--blue btn-sm">Next Page</button>

or this

<button *ngIf="this.users['page-state'].length>!==''" (click)="getNextPage()" id="next-page-button" class="btn content-div__button--blue btn-sm">Next Page</button>

answered Jul 16, 2018 at 5:27

Roopesh Kumar Ramesh

1581 silver badge10 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Manu Chadha Over a year ago

Thanks. *ngIf="this.questions['page-state']!='' " also worked (inner quotes after != are two single quotes, together they look like a double quote!).

Roopesh Kumar Ramesh Over a year ago

glad i could help

Collectives™ on Stack Overflow

How to check for an empty string in typescript

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related