Sou um usuário antigo do Angular 1.x e agora estou trabalhando para criar um novo aplicativo usando o Angular 4. Ainda não entendo a maioria dos conceitos, mas finalmente tenho algo funcionando muito bem. No entanto, estou tendo um problema em que preciso exibir um componente Angular 4 (embora no 1.x eu usei diretivas) dentro do pop-up de um marcador usando o Leaflet.

Agora, no Angular 1.x, eu poderia usar $ compile em um modelo com a diretiva dentro dele (`<component>{{ text }}</component>`) com botões e assim por diante, e isso funcionaria, mas o Angular 4 é totalmente diferente com sua coisa AoT e a compilação em tempo de execução parece ser realmente difícil e não há solução fácil para isso.

Eu fiz uma perguntaaqui e o autor diz que eu poderia usar uma diretiva. Não tenho certeza se essa é a abordagem correta ou mesmo como misturar meu próprio código com a solução proposta ... então, eu fiz um pequeno projeto baseado em NPM com o Angular 4 e o Leaflet já configurados, caso você saiba como ajudar eu ou quero experimentá-lo (eu aprecio muito!). Eu estive balançando a cabeça por talvez uma semana e estou realmente cansado de tentar muitas alternativas sem sucesso :(

Aqui está o link do meu repositório no GitHub:https://github.com/darkguy2008/leaflet-angular4-issue

A idéia é gerar o PopupComponent (ou qualquer coisa semelhante a ele) dentro de um marcador, código que você pode encontrar em src / app / services / map.service.ts, linha 38.

Desde já, obrigado! :)

EDITAR

Eu consegui resolvê-lo :) veja a resposta marcada para obter detalhes, ou esta diferença. Existem algumas ressalvas e o procedimento para Angular 4 e Leaflet é um pouco diferente e não exige muitas alterações:https://github.com/darkguy2008/leaflet-angular4-issue/commit/b5e3881ffc9889645f2ae7e65f4eed4d4db6779b

Também fiz um serviço de compilação personalizado com esta solução explicadaaqui e enviado para o mesmo repositório do GitHub. Obrigado @yurzui! :)