Dúvida sobre parâmetros

Eu criei um componente seguindo o exemplo do foto.component com algumas adaptações e percebi que os parâmetros só são passados da view para o componente se estiver dentro do app.component exatamente como o de foto.

O que eu desejo fazer é chamar o componente no index e recuperar esses parâmetros no componente relacionado. Alguém saberia informar como consigo isso?

*Obs. Também tentei realizar a mesma lógica de passagem de parâmetros no app.component e não recebo os valores no app.component.html.

o código de cada arquivo segue adiante:

// messenger.component.ts

import { Component, Input } from '@angular/core';

@Component({
    moduleId: module.id,
    selector: "messenger",
    templateUrl: "./messenger.component.html"
})
export class MessengerComponent {

    @Input() msg;
    @Input() titulo;
    @Input() type;

}

//messenger.module.ts
import { NgModule } from "@angular/core";
import { MessengerComponent } from "./messenger.component";
import { BrowserModule } from "@angular/platform-browser";

@NgModule({
    imports : [BrowserModule],
    declarations: [MessengerComponent],
    bootstrap: [MessengerComponent],
    exports:[MessengerComponent]
})
export class MessengerModule{};

//messenger.component.html
<div class="alert alert-{{type}}" role="alert">
    <span class="glyphicon glyphicon-exclamation-sign" aria-hidden="true"></span>
    <span class="sr-only">{{titulo}}</span>
    {{msg}}
</div>

//main.ts
import {platformBrowserDynamic} from "@angular/platform-browser-dynamic";
import {AppModule} from "./app.module";
import {MessengerModule} from "./messenger/messenger.module";

const platform = platformBrowserDynamic();
platform.bootstrapModule(AppModule);
platform.bootstrapModule(MessengerModule);

//index.html
(...)
<messenger titulo="Sucesso" type="warning" msg="Operação realizada com sucesso."></messenger>
(...)