AngularJS: $scope.flags.loading For A Particular Section

Question

AngularJS: $scope.flags.loading For A Particular Section

I'm trying to add the loading icon for a particular section of the page (Note: Entire page SHOULD NOT have this) while making an AJAX calls or on some events. I tried writing a directive and which makes that scope's flags.loading = true. But this didn't work. Any ideas?

Thanks in advance :-)

javascript
angularjs
angularjs-directive

Answer 1

Here you have working example of directive changing parent scope's variable loading from value no to yes.

var app = angular.module('app', []);

app.directive('loadingDirective', function() {

    var linkFn = function(scope, element, attrs) {         
        scope.loading="yes";        
    };

    return {
        link: linkFn
    }

});

app.controller('TestController', function ($scope) {
    $scope.loading = "no";    
});

Here you have also working JSfiddle.