Authenticated User Content

Restrict content based on an authenticated user in your app's custom HTML page. Use an Angular ngIf statement to display certain content based on a user's login status.

Note: this does not work with page builder blocks at this time.

Only for logged in users

*ngIf="user"

Only for logged out users

*ngIf="!user"

Custom HTML template sample

<div *ngIf="user">
    <h2 *ngIf="user.username">Hello, {{ user.username }}</h2>
    <p>A logged in user can see this</p>
</div>
<div *ngIf="!user">
    <p><button ion-button large type="button" (click)="loginModal()">Please Login</button></p>
</div>

User Roles template sample

<!-- Example of a logged in user that has a role -->
<div *ngIf="hasRole('admin')">You are an admin</div>
<div *ngIf="hasRole('member')">You are a member</div>

<!-- Example of a user who is not logged in -->
<div *ngIf="!user">Hello stranger. You are not logged in.</div>

How to add roles to your app authenticated user

See User Roles