Guias dinâmicas angulares com componentes escolhidos pelo clique do usuário

Estou tentando configurar um sistema de guias que permita que os componentes se registrem (com um título). A primeira guia é como uma caixa de entrada, há muitas ações / itens de link para escolher para os usuários, e cada um desses cliques deve poder instanciar um novo componente, ao clicar. As ações / links vêm do JSON.

O componente instanciado será registrado como uma nova guia.

Não tenho certeza se essa é a melhor abordagem? No Sofar, os únicos guias que vi são para guias estáticas, o que não ajuda.

Até agora, só tenho o serviço de guias, que é inicializado principalmente para persistir em todo o aplicativo, se parece com algo assim.

export interface ITab { title: string; }

@Injectable()
export class TabsService {
    private tabs = new Set<ITab>();

    addTab(title: string): ITab {
        let tab: ITab = { title };
        this.tabs.add(tab);
        return tab;
    }

    removeTab(tab: ITab) {
        this.tabs.delete(tab);
    }
}

Questões:

Como posso ter uma lista dinâmica na caixa de entrada que cria novas guias (diferentes)? Eu estou adivinhando oDynamicComponentBuilder seria usado?Como os componentes criados a partir da caixa de entrada (no clique) se registram como guias e também podem ser mostrados? estou a adivinharng-content, mas não consigo encontrar muitas informações sobre como usá-lo

Editar: tente esclarecer

Pense na caixa de entrada como uma caixa de correio, os itens são buscados como JSON e exibem vários itens. Depois que um dos itens é clicado, uma nova guia é criada com a ação desses itens 'type'. O tipo é então um componente

Edit2: Imagem

http://i.imgur.com/yzfMOXJ.png

questionAnswers(3)

yourAnswerToTheQuestion