javascript - Elegantly hiding the navbar in a single page MEAN app. -


I have an app that has a navbar on every page, so I generated it in the index. Z file is okay for 99% of my app

This is the only place that runs on the login screen because it looks strange for a nouber on the login screen, so I bought a boolean $ If you are on the homepage

This is okay, but Nabarbar still loads for a second partition, then it disappears, if you use the angular to check against the root scope variable and hide the navbar. goes. I know that I can not factor it in a file and mislead it in every single Z file other than the login page, but it will be a maintenance nightmare.

Is there any way that I can make my NewBarwen effective, using the ng-hide, hide it on the login screen, and do not load until I login.

This is my code that I did to you, p>

The controller who checks to see if you are in the root of the app ('/')

  angular.module ('app'). Controller ('LoginCtrl' function ($ radius, $ http, mvIdentity, mvNotifier, mvAuth, $ location, $ rootsecope) {$ rootScope.currentPath = $ location.path (); .... ....   

Z file that shows how this variable is being used to hide navbar

  block the main content section. nav.navbar.navbar- Default (ng-hide = 'currentpat == "/"', role = 'navigation') .... .... ....   

Then on successful login, current Path variables are set to lie on to bring Naber back. $ rootScope.currentPath = fa lse;

I would like to keep this set up because it means that any changes can be made to navbar in a file and it will be inherited throughout the app, maintenance is quite But I like to wait for the login to load, after opposing the flicker shown to the navbar, then hidden, and then shown again.

Yes, it is possible to do this.

Because you are flashing things because the reason is that page load is bootstrap before angle and implemented ng-hide .

There are two approaches to solving this.

1 Put your script files in the head of the page

This is my preferred way by putting script files in the head element , The page will not render until the script is loading. This means that the angular page will first bootstrap, and when does render, then ng-hide will be implemented correctly.

Some people like the page to start loading first, will not use this method, but I personally do not think that it matters.

Use on Elements to hide on 2 elements

Basically, by applying the ngCloak instructions for elements and embedding the style given in the link , You can hide some elements until the page is loaded. Originally the NGLL elements on display: none does not apply and removes it when the angular loading.

Comments

Popular posts from this blog

php - PDO bindParam() fatal error -

logging - How can I log both the Request.InputStream and Response.OutputStream traffic in my ASP.NET MVC3 Application for specific Actions? -

java - Why my included JSP file won't get processed correctly? -