using angular 1.2.10 with ngRoute, jquery 1.10.2 I have the following code in my index.html:
<body ng-controller="MainCtrl">
<div ng-include src="'partials/login/login.html'"></div>
<div ng-if="isAuthenticated()">
<div ng-view/>
</div>
<!--javascript files-->
</body>
The initial login page(not configured as a route), downloads all the needed javascript files, but after I login, and ng-if evaluates to true, I notice a bunch of XHRs fired off by jquery for all the javascript files in the browser console:
XHR finished loading: "http://myurl/jquery-1.10.2.min.js?_=1392752363272"
XHR finished loading: "http://myurl/angular.min.js?_=1392752363273"
XHR finished loading: "http://myurl/app.js?_=1392752363274"
...and so on
console reports that these XHRs are being executed from jquery.1.10.2:8706
Based on the documentation it appears that when ng-if evaluates to true the element is created and compiled at that time. I imagine this has something to with ng-view and ngRoute and how these are wired together but I wasn't able to glean from the documentation why this particular behavior is occurring. If anyone could lend some insight into this behavior and/or if there is something fundamentally wrong with the approach I was trying to take it would be much appreciated.
Note:This behavior does not occur if I use replace ng-if with ng-show.
Like you said, ng-if
does not render its contents if it evaluates to false
.
You're better off creating a separate route for your login page which will redirect you once you've been authenticated.