Sim, é possível fazer isso em Angular. Uma opção seria utilizar o módulo "RouterModule" do Angular para criar rotas para as aplicações externas e carregá-las em um componente "wrapper" que contenha o router-outlet.
Para isso, você pode criar um componente wrapper que contenha o router-outlet e crie rotas para cada aplicação externa que deseja acessar. As rotas podem ser definidas como componentes vazios, pois o objetivo é apenas redirecionar para a URL externa.
Por exemplo:
const routes: Routes = [
{ path: 'app1', component: EmptyComponent, data: { externalUrl: 'http://www.app1.com' } },
{ path: 'app2', component: EmptyComponent, data: { externalUrl: 'http://www.app2.com' } },
];
@Component({
selector: 'app-wrapper',
template: '<router-outlet></router-outlet>',
})
export class WrapperComponent implements OnInit {
constructor(private router: Router) {}
ngOnInit() {
this.router.events
.pipe(filter((e) => e instanceof NavigationEnd))
.subscribe((e: NavigationEnd) => {
const url = e.urlAfterRedirects;
const route = routes.find((r) => url.includes(r.path));
if (route) {
window.location.href = route.data.externalUrl;
}
});
}
}
@Component({
template: '',
})
export class EmptyComponent {}
Nesse exemplo, as rotas "app1" e "app2" redirecionam para as URLs externas "http://www.app1.com" e "http://www.app2.com", respectivamente. O componente "WrapperComponent" contém o router-outlet e o componente "EmptyComponent" é utilizado apenas como um placeholder para a rota.
No método ngOnInit do componente "WrapperComponent", é inscrito um evento para detectar a navegação para uma rota e, se a rota for uma das definidas, a aplicação é redirecionada para a URL externa correspondente.
Assim, ao navegar para a rota "/app1" ou "/app2", a aplicação Angular redirecionará para as respectivas URLs externas, que serão carregadas em uma única instância do componente "WrapperComponent" e exibidas no router-outlet.
É importante lembrar que, ao acessar uma aplicação externa, o controle do Angular é perdido, portanto, o estado da aplicação externa não será mantido no contexto do Angular.