2016-02-26 62 views
2

首先,我看了其他問題在stackoverflow關於它,我收到了許多答案,但仍然無法解決我的問題。AngularJS視圖不更新當模型改變

我正在使用Angular Material,並且在查看模型同步時遇到問題&。

這是我的控制器代碼:

$scope.getQuestionByDateRange = function (range) { 
    QuestionService.getQuestions(1, 'week', 10, function (response) { 
     $scope.questions = response.data; 
    }) 
} 

這是我的看法代碼:

<ul> 
    <li ng-repeat="question in questions">{{question.title}}<li> 
<ul> 

我的觀點正確渲染模式,同時我更新控制器$scope.questions變量。

但是當我再次更新$scope.questions:我的模型得到更新(我可以看到控制檯日誌中的更改),但視圖沒有。

我研究它,我發現像$scope.$apply,$scope.$digest,$scope.$evalAsync的解決方案,但無法解決我的問題。

怎麼了?

+3

你能提供更多的代碼或小提琴讓我們看到你的問題嗎? –

+0

您是將問題設置爲新數組還是將新元素推入現有數組? –

+0

@DaveBush我推送新元素到現有的數組。 –

回答

4

這裏的問題是,整個對象被替換(因此它失去它的結合視圖)。

我會代替整個對象;只是取代它的元素。

$scope.questions = $scope.questions || []; 
$scope.getQuestionByDateRange = function (range) { 
QuestionService.getQuestions(1, 'week', 10, function (response) { 
    $scope.questions.length=0; // Reset the array 
    $scope.questions.push.apply($scope.questions, response.data); 
}) 
} 
+0

這就是我一直在試着去問的。如果他不重複使用相同的數組,這是正確的答案。 –

0

你可以用$腕錶方法做到這一點:

$scope.$watch('questions', function(){ 
    $scope.getQuestionByDateRange(range); 
}); 

$表方法各$ scope.question修改

+0

這是一個不應該被需要的破解 –

+2

它會導致$ scope.getQuestionByDateRange調用的無限循環 –

0

您遇到的是你要替換的問題時觸發整個數組,這似乎會導致與Angular的問題。

$scope.getQuestionByDateRange = function (range) { 
 
    QuestionService.getQuestions(1, 'week', 10, function (response) { 
 
     $scope.questions.push.apply($scope.questions, response.data); 
 
    }); 
 
}