How to add the page loader in angularJS??

To add the page loader , we need to determine the http request sent by us has been responded or not.

For this simple query we need to evaluate just the value of following expression.

$http.pendingRequests.length.

Following directive can be used anywhere to install loader the page on loading:-

Example:-

angular.module('myApp.loading',[])

   .directive('loading',   ['$http' ,function ($http)
    {
        return {
            restrict: 'A',
            link: function (scope, elm, attrs)
            {
                scope.isLoading = function () {
                    return $http.pendingRequests.length > 0;
                };

                scope.$watch(scope.isLoading, function (v)
                {
                    if(v){
                        elm.show();
                    }else{
                        elm.hide();
                    }
                });
            }
        };

    }]);

In View Page :-

Where spinner is the class you want to add as animation or loading image.

More about
Http Request

Share on Google+Share on FacebookTweet about this on TwitterEmail this to someone
  

How to show local json data in chrome using angular JS??

Working with angularJS needs a JSON file to play with data. But the irony of the chrome is behind the fact that the local JSON file data can’t be displayed in simple chrome browser.

Solution of this could be using any deployment server environment on your system like Java or python. But as a front end developer this seems to be quite difficult.So the solution is ,actually there.

Yes the chrome does not display data using local file due to some security reasons but this security can be turned off using simple command prompt.

1. Find the path for chrome.exe file :-

open command prompt
type cd\
type dir chrome.exe /s /p
now with path obtained in this step goto this path
and then execute following command:-

chrome.exe –allow-file-access-from-files

Capture

Share on Google+Share on FacebookTweet about this on TwitterEmail this to someone
  
Please wait...

Subscribe to our newsletter

Want to be notified when our article is published? Enter your email address and name below to be the first to know.