AngularJS在控制器之間共享數據使用服務並觀看更新

這裏的任務很簡單，但不清楚這個錯誤。AngularJS在控制器之間共享數據使用服務並觀看更新

我的服務：

app.factory('Progress', function() { 

    var data = { 
     progressPercentageLoaded: 0 
    }; 

    return { 
     getProgress: function() { 
      return data.progressPercentageLoaded; 
     }, 
     setProgress: function (progress) { 
      data.progressPercentageLoaded = progress; 
     } 
    }; 
});

我有一個控制器是上傳文件，這個設置進度值。

//in my controller 
$scope.progressPercentageLoaded = {progress:0}; 
//a few lines down 
function (evt) { 
console.log(evt); 
$scope.progressPercentageLoaded.progress = evt.loaded; 
Progress.setProgress($scope.progressPercentageLoaded.progress);

我的第二個控制器應該簡單地監視更改的服務和更新的觀點，但它保持停留在零即使我確認上傳正在發生的事情，並且evt.loaded正在發生變化。

$scope.progress = 0; 
$scope.$watch(function() { return Progress.getProgress(); }, function (newValue, oldValue) { 
     if (newValue !== oldValue) { 
      $scope.progress = Math.min(100, parseInt(100 * newValue/$scope.size)); 
      if($scope.progress == 100) 
      { 
       $scope.progressModalInstance.close(); 
       window.location.reload(); 
      } 
     } 
    });

即，在$scope.progress第二控制器應與evt.loaded在第一控制器的值更新，但它沒有。

在此先感謝您的任何指導。

編輯：我甚至增加了第三watch參數作爲true但這並沒有幫助。

編輯2：以上實際代碼工作，據我所知，我相信別的東西是導致一個問題，當我恢復的代碼上面的編輯它由於答案後，它突然像它應該那樣工作。爲此事道歉。使用$ rootScope。$廣播將努力爲這個

app.factory（ '進步'，功能較好

來源

2017-06-18 Summer Developer

您是否在控制檯中看到任何錯誤？這些控制器是否相互繼承？我用2個控制器創建了一個簡單的例子，並且我看到觀察者正在執行。但不是上傳文件，我每2秒調用一次'setProgress'：'var p = 0; setInterval（function（）{$ scope。$ apply（function（）{Progress.setProgress（++ p）;}）;}，2000）;'這是否適合您？ –

@FrankModica上面的代碼實際上工作，我不知道爲什麼它以前沒有工作，但我只是恢復到上述，它的功能很好。我看到上傳事件被記錄，但上傳百分比沒有變化，可能上傳太大了，即使上傳的內容更多，它也沒有變化？我不確定，但是我剛剛嘗試了一些小文件，並且視圖已經適當更新，沒有對上述代碼進行任何更改，很抱歉浪費您的時間！ :( –

沒問題，很高興它的工作:) –

（$ rootScope）{

var data = { 
    progressPercentageLoaded: 0 
}; 

    return { 
     getProgress: function() { 
      $rootScope.$broadcast('Event'); 
      return data.progressPercentageLoaded; 
     }, 
     setProgress: function (progress) { 
      data.progressPercentageLoaded = progress; 
     } 
    }; 
});

在你的第二個控制器，而不是使用觀看東西像

$rootScope.$on('Event', function(){ 
    //your logic here 
})

來源

2017-06-18 23:52:36 Tik

如果可能，我寧願堅持'watch'。 –

你失去的參考，因爲你正在觀看的Int值要更新每一次，因此你正在改變參考。你必須觀看整個對象progressPercentageLoaded。

您必須通過作爲$watch函數的最後一個參數，以便相等性檢查爲angular.equals。否則，只檢查參考相等性。

來源

2017-06-19 00:49:30 mattias

對不起，我明白你在說什麼，但沒有在代碼中做出這個改變......我只看着'Progress.getProgress（）;'，如果我只是返回對象而不是'data.progressPercentageLoaded ;'我仍然有同樣的問題！ –

@SummerDeveloper我編輯了我的答案，看看。 – mattias

我有'真'作爲最後一個參數，它仍然無法正常工作。 –

我不是100％確定，但Angular可能不知道文件上傳事件。請致電$apply：

$scope.$apply(function() { 
    Progress.setProgress($scope.progressPercentageLoaded.progress); 
});

來源

2017-06-19 01:16:24

我曾經認爲這是事實，並且之前嘗試過，而現在，它並沒有解決問題。 :( –

AngularJS在控制器之間共享數據使用服務並觀看更新

回答

相關問題