angular2 : open ng2-bootstrap modal from parent component

I'm trying to open an ng2-bootstrap modal from a parent component. I have created a ModalComponent and I "exportAs: child". My ModalComponent looks like

import { Component, Input, ViewChild } from '@angular/core';
import { ModalDirective } from 'ng2-bootstrap/ng2-bootstrap';

@Component({
    selector: 'modal',
    moduleId: module.id,
    templateUrl: 'modal.component.html',
    styleUrls: ['modal.component.css'],
    exportAs: 'child'
})
export class ModalComponent {

    @ViewChild('childModal') public childModal:ModalDirective;

    public show( variant ):void {

        console.log( this.childModal );
        this.childModal.show();
    }

    public hide():void {

        this.childModal.hide();
    }
}

and I include the modal in the parent template as

<modal #c="child"></modal>

... and call it from the parent template as

<button type="button" class="btn btn-primary" (click)="c.show(variant)">open</button>

I hit the "show" method inside the ModalComponent correctly but the value of "childModal" is always undefined (Nb: console.log() statement).

Any pointers are greatly appreciated.

With the assistance of @yurzui I realised my mistake was in the HTML. I had defined my modal as

<div bsModal #smModal="bs-modal"...

Nb: "smModal" which needed to be rewritten as

<div bsModal #childModal="bs-modal"...

... and voila! "childModal" is no longer undefined.