Why is my Angular2 *ngIf not working with this function that returns a boolean?

Question

I have a div that should display if the permissions are correct. The *ngIf statement is calling a service with a method that returns a boolean. If the boolean is true, the div should show.

Here's the code for the div:

import { ShowMeService } from '../services/showme.service';

let styles = require('./admin.css');

@Component({
selector: 'admin',
  directives: [ProtectedDirective],
  template: `
    <div style="margin-top: 40px" protected>
      <div class="home centered">
        <div class="logout"><a class="btn btn-primary btn-sm" 
        role= "button"(click) = "logout()" > Logout </a></div>
        <a href = "/home"><< Launchpad</a>
        <h2>User Admin</h2 >
        A permissioned div appears below if the user has permission to view:
        <hr>
        <div *ngIf="checkPermissions(5)">
          <p>
          This is an example of a page that would only be visible to roles with proper permissions.
          </p>
          <p>
            The link to this page is not visible to certain roles.
          </p>
        </div>
      </div>
    </div>
  `,
  styles: [styles],
  providers: [ShowMeService]
})


export class Admin {
  constructor(private _showMeService: ShowMeService) {}

  checkPermissions(permission: integer) {
    this._showMeService.showme(permission);
  }
}

And here's the service that returns a boolean when called:

import {Injectable} from 'angular2/core';

@Injectable()

export class ShowMeService {
    showme(permission: integer) {
        let bool = false;
        if (permission === 5) {
            bool = true;
            return bool;
        }
    }
}

But no matter what it always fails to display, even when it is obviously returning true.

Answer 1

I guess it's the missing return

  checkPermissions(permission: integer) {
    return this._showMeService.showme(permission);
  }