Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

275
Visualizações
¿Cómo cargar componentes de forma diferida dentro de una aplicación angular que se usa como componente web? (¿cómo cargar fragmentos del servidor correcto?)

¿Cómo puedo configurar mi aplicación que se ejecuta como un componente web que tiene que cargar fragmentos del servidor que sirvió los scripts para el componente web, en lugar de intentar realizar una carga diferida desde el servidor que solo sirvió la página que contiene el componente web?

El problema con más detalle:

Tengo un componente en mi aplicación angular LazytestComponent que está cargado de forma diferida.

El código para cargarlo:

 const {LazytestComponent} = await import('../lazytest/lazytest.component'); const componentFactory = this.componentFactoryResolver.resolveComponentFactory(LazytestComponent); const instance = this.lazyContainer.createComponent(componentFactory, undefined, this.injector);

Angular genera un fragmento para este componente, al que solo se accede (pestaña de red) cuando se ejecuta este código perezoso.

Esto funciona cuando se ejecuta la aplicación con ng serve.

Ahora esta compilación como un componente web, usando angular/elements:

En el @NgModule:

tenemos:

 ngDoBootstrap() { const webComponent = createCustomElement(LazyApp, {injector: this.injector}); customElements.define('lazyapp', webComponent); }

Esto también funciona, ahora puedo cargar los 3 archivos de script de mi aplicación en otro servidor y usar la <lazyapp> para incluirla en la página.

página html en el otro servidor:

 <html> <head> <script src="http://localhost:8089/lazy/polyfills.js"></script> <script src="http://localhost:8089/lazy/runtime.js"></script> <script src="http://localhost:8089/lazy/main.js"></script> </head> <body> <lazyapp></lazyapp> </body> </html>

La página web se sirve desde localhost: 8080; la aplicación angular se carga desde localhost: 8089.

La aplicación se carga como el componente web, pero luego falla cuando se ejecuta la carga diferida.

En lugar de cargar el fragmento desde "http://localhost:8089/lazy/317.js", intenta cargarlo desde "http://localhost:8080/317.js": este es el servidor que sirve la página html , y por supuesto que no está allí.

¿Cómo puedo decirle a mi aplicación la URL donde puede encontrar sus fragmentos?

about 4 years ago · Juan Pablo Isaza
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda