I'm having an issue with ng-show when the page is loading and making a requests.
My app has a list with the html looking like this
<ul ng-show="todo.length">
...
</ul>
And a button when the list is empty
<button ng-show="!todo.length"> myButton</button>
My issue is , that my list is being populated on app load by a service call. So initially when the app loads the list is empty, and shows the button, but a second later the list fills, the button disappears and the list reappears. Everything works as expected, except for that flicker. Its a 1 second flicker that is waiting for that list to appear. Is there some different approach to this situation? When the app loads how can I tell my button that there is data, its just being filled up?
does the flicker appear in every browser or is it browser specific?
Delay the display of your view until your data is in. If you are using ngRouter, this is exactly where the resolve block comes in.
If you are not using a router, you can deal with this in your controller/directive
If you are not using a router, you can deal with this in your controller/directive
in the view you do something like:
<div ng-if='vm.dataIn'>...your view...</div>
in your controller something like:
function myController($http) {
var vm=this;
//$http should be in a service, not in a controller!!, this is just a sample!
$http.get('goGetMyData').then( function (response) {
// handle the response, and put everything in place
// then 'unlock' the view:
vm.dataIn = true;
})
}
Does that help you?Thank you! Perfect it worked!
I was doing something similar, but hiding and showing the add button instead, I never thought of just hiding the entire view itself!
One thing i just noticed recently when doing a resolve on a promise using ngrouter is that its completely bombing when wrapping it in cordova when i wrap it for all ios and some older android devices. Have you heard of that before?
Hmm.. the app I am working on is using Cordova, but havn't tested on a physical device yet.
did you find that it worked ok?
I will do so and let you know my results.
did you find that it worked ok?
댓글 없음:
댓글 쓰기