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á-loEditar: 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