CODEWITHSUNDEEP
javascriptangulartypescript
Sharifullah Sharif
Sharifullah Sharif

Reputation: 121

Angular2 Bootstraping two application one ofter other in same page

I am working on a project in angular2. It has two part, first part is login and other is dashboard. I want to develop login part in one app and the dashboard part in other app.

The problem is, I cant not load dashboard app after login app in same page.

I found a link in which they Bootstrap two application in same page, But I want to load one app at the time in same page.

The link in which they Bootstrap two app in same page is:

Bootstrapping multiple Angular 2 applications on the same page

Main purpose for doing so: Security

Suppose the user wants to log in, I want the Dashboard app get bootstrapped by Angular2 separately.

Why I'm not using separate components is because I don't want to expose other components that are loaded along side the Login component.

Upvotes: 1

Views: 333

Answers (1)

Steve Schmitt
Steve Schmitt

Reputation: 3209

I see two main options here (I'm sure there are others):

Option 1: Separate apps for login and dashboard

You could make your login and dashboard app each have their own urls, e.g. https://myhost:1234/login and https://myhost:1234/dash.

When users try to go to /dash, the server checks if they are logged in, and redirects to /login if they are not. When users log in through /login, the server sets up the session, then redirects to /dash.

Option 2:

Use a guard on the router, that prevents the user from navigating to dashboard unless they are logged in.

See the TempHire Sample Application for an example using guards. In this example, the guard performs an ajax call to the server, and uses the response to determine whether to proceed. (The response also brings the Breeze metadata to the client, but that's because it's a Breeze app.)

Upvotes: 2

Related Questions