CODEWITHSUNDEEP
javascriptangularjsangularjs-directive
user5917414
user5917414

Reputation: 65

Refresh Angular directive

I have this directive that use the service "BoxService" to take a certain value.

angular.module("App").directive('boxedWidget',
   function () {
       return {
           restrict: 'E',
            scope: {       
            'source': '=',    
            },
          replace:true,
          templateUrl: '/widgets/box/widget.html',
          link: function (scope, element, attrs) {
              scope.item = scope.source;
               boxService
                .getBoxeValue(scope.item.id)
                .success(function(data, status, headers, config) {
                     scope.item.value = data;
                });

           }


        }

    });

Now I want to refresh the value every 5-seconds. Any suggestion?

Upvotes: 2

Views: 349

Answers (2)

AlainIb
AlainIb

Reputation: 4708

did you inject $interval properly ? 

  angular.module("App").directive('boxedWidget', ['$interval', function($interval) {
       return {
           restrict: 'E',
            scope: {       
            'source': '=',    
            },
          replace:true,
          templateUrl: '/widgets/box/widget.html',
          link: function (scope, element, attrs) {
              scope.item = scope.source;
              // don't forget to inject $interval in the directive declaration
              $interval(function(){
                   boxService
                    .getBoxeValue(scope.item.id)
                    .success(function(data, status, headers, config) {
                         scope.item.value = data;
                    });
              }, 5000);
           }


        }

    });

Upvotes: 0

CandleCoder
CandleCoder

Reputation: 1503

You can try $interval to reload your data in Directive

$interval(function () {
loadData();
}, duration)

For more details of $interval you can refer to Angular $interval

Upvotes: 2

Related Questions