javascript - Angular HTTP Requests to Render Different HTML -

so have rest endpoint @ url /check returns serialized user data so:

{     'username' : 'malikb',     'email': 'test@gmail.com',     'first_name': 'malik',     'usertype': 'c' } 

i've designed endpoint return 401 status code users not logged in , 200 status code users are, , works fine. however, i'm trying use angular's $http service extrapolate both status code , usertype key if available.

essentially, i'm trying use <ng-include> render different navigation bar anonymous users logged in , different ones logged in depending on user type. however, issue i'm running fact requests asyncronous. furthermore, ng-if , src attributes included html seem evaluate continuously thereby sending thousands of http requests. there way achieve such feature?

avoid using asynchronous functions in html templates evaluate every digest cycle. avoid tangling concerns of model , view. view should render model. controller modifies model using user events view , events elsewhere.

app.controller('ctrl', function($http) {     var vm = this;     this.$oninit = function() {         vm.userdata = { username: 'anonymous' };         $http.get("/check").then(function(response) {             vm.userdata = response.data;         });     }; }); 

<user-navbar ng-hide="vm.userdata.username == 'anonymous'></user-navbar> <anon-navbar ng-show="vm.userdata.username == 'anonymous'></anon-navbar>