[Fixed] How to display text follow role?

Issue

I want to display the title of the text on the edit page as the function is written.

app.html

<div class="header content">
      <h5 *ngIf="getRoleEditPage()">
        <i class="fas fa-edit"></i>
          {{ text }}
      </h5>
</div>

app.ts

  getRoleEditPage() {
    let text: string
    if (this.user.roles.customer === true) {
      text = `Customer's Edit Ticket`
    } else if (this.user.roles.supporter === true) {
      text = `Supporter's Edit Ticket`
    } else if (this.user.roles.maintenance === true) {
      text = `Maintenance's Edit Ticket`
    } else if (this.user.roles.supervisor === true) {
      text = `Supervisor's Edit Ticket`
    } else if (this.user.roles.developer === true) {
      text = `Developer's Edit Ticket`
    }
    return text
  }

Solution

You need to bind the result from your getRoleEditPage, as follows (using aliasing):

<div class="header content">
      <h5 *ngIf="getRoleEditPage() as text">
        <i class="fas fa-edit"></i>
          {{ text }}
      </h5>
</div>