更新變量時傳遞到visualizejs方法angularjs

Question

所以我想要做的是顯示我的加載指令，當我點擊生成按鈕，並在報告完成時隱藏加載指令。由於visualize.js有一個「reportCompleted」事件我更新我的抓取變量爲false以隱藏加載指令。

<button class="btn btn-default" data-ng-click="vm.generateReport(filter)">Generate</button> 

<div class="text-center info-message" data-ng-show="vm.fetching"> 
    <loading message="Fetching report..."></loading message> 
    <span>{{vm.fetching}}</span> 
</div> 

這裏是我的控制器內：

var self = this; 
// this is declared on top as default variable 
self.fetching = false; 

這是被調用來顯示加載指令和報告方法

function generateReport (filterData) { 
    // show loading directive 
    self.fetching = true; 

    v('#report').report({ 
     'resource' : '/public/Samples/Reports/01._Geographic_Results_by_Segment_Report', 
     'container' : '#report', 
     'error'  : handleError, 
     'events': { 
      'reportCompleted' : function(status) { 
       self.fetching = true; 

       if(status === 'ready') { 
        // hide loading directive 
        self.fetching  = false; 
        self.reportRendered = true; 
       } 
      } 
     } 
    }); 
    }); 
} 

我的問題是什麼，即使我已經在事件監聽器'reportCompleted'中更新了我的抓取變量，它仍然不隱藏我的加載指令。我嘗試了visualize方法外的console.log（self.fetching），它返回true而不是它應該返回false。這是爲什麼發生？

Answer 1

visualizejs是一個外部庫，並未集成到角度生命週期中。 需要調用$scope.$apply(function)或$scope.$digest()通知角的模式發生了變化，它應該更新GUI

的記者應該在控制器或給出指令，您可以訪問$範圍運行：

v('#report').report({ 
     'resource' : '/public/Samples/Reports/01._Geographic_Results_by_Segment_Report', 
     'container' : '#report', 
     'error'  : handleError, 
     'events': { 
      'reportCompleted' : function(status) { 
       self.fetching = true; 

       if(status === 'ready') { 
        // hide loading directive 
        self.fetching  = false; 
        self.reportRendered = true; 
       } 

       $scope.$digest(); 
      } 
     } 
    });