Showing custom view based on user role in angularjs

Question

I want to show different views based on the user of my application for example if the user is admin he can see all the controls or when it is acting as user he can only see a subset of controls and UI and he can perform the limited action.

One solution that comes to my mind is sending the role information with the page as a JSON but that would require me to have knowledge of the logged in user so, basically I can first check if the user is logged in or not through the cookie? if no I can just load the lightweight version of the login page and after user logs in then I can send a new page altogether with user's profile information embedded in it.

The other approach that I see is that I can bootstrap my angular application and then check the login status and if the login is done, then bring the profile information through a JSON and update the view, but I think it would be slow and error-prone.

I don't know what is best / recommended approach.

Answer 1

First approach seems to be a better approach out of these 2.

Problem with the second approach is you are sending 2 requests to the server - one for login and then 2nd one to get the user role/profile. If you are choosing this approach then you may have few issues depending how are you going to implement it:

1. If you are updating your UI after login then you will have to decide what should be shown to the user since you don't know the user profile yet. Even if you come up with some minimal privilege UI, there will be another request to get the profile which will kind of refresh the UI again - 2 UI refreshes could be annoying for the user. Not to mention that there 2 requests going which could make your site slow.
2. If you decide not to update the UI after login but only after you get user profile, still the delay would be more as you will have to wait for response of 2 separate requests. Could be a major issue with slow networks(consider mobile)

If you are using the first approach, you'll get away with above mentioned problems.