nb-card-header doesn't render in initial load

[dogukanevcil]

I'm submitting a bug report

Issue description

Current behavior: When I login and redirect to the authenticated part of my application. I can't see nb-card-header until I refresh the page. The nb-card-header component can be seen in inspect even if it is not rendered.

Before refresh (initial load)

After refresh

This is happening when a user signs in and redirected to the dashboard. In dashboard I have multiple pages like this and none of them render nb-card-header. When I navigate site through dashboard with router, it doesn't render aswell but if I reload one of the pages or navigate by changing url it starts to render.

I can see nb-card-header component in the inspect even if it is not rendered.

Expected behavior: It should render initially like other components.

Related code:

    <nb-card [nbSpinner]="loading">
      <nb-card-header>
        Users
        <button nbButton
                [routerLink]="['/users/new']"
                class="table-button"
                status="primary"
                size="small">
          NEW
          <nb-icon icon="plus-outline"></nb-icon>
        </button>

      </nb-card-header>
      <nb-card-body>
        <table datatable
               [dtOptions]="dtOptions"
               [dtTrigger]="dtTrigger"
               width="100%"
               cellspacing="0"
               class="row-border hover">
          <thead>
          <tr>
            <th>ID</th>
            <th>Name</th>
            <th>E-mail</th>
            <th>Organisation</th>
            <th>Actions</th>
          </tr>

          ....

[Jannexy]

Did you resolve this issue? I have the same problem and I don't found the solution

[dogukanevcil]

Yes, I did a workaround. I had an login component where I redirect the user to the dashboard after login. As the headers are visible after refresh, I used window.location.href in the login component for the redirect.