當使用ngResource模塊時，我的模型沒有正確更新

我對Angular有個小問題。我使用$ngResource模塊以解決我的服務器「意見」：當使用ngResource模塊時，我的模型沒有正確更新

var app = angular.module('app', ['ngResource']);  
app.factory('comment', function($resource) { 
    return $resource('/comments'); 
}); 
app.controller('commentsController', function($scope, comment) { 
    $scope.comments = comment.query(); 
});

我用ngRepeat指令來顯示所有評論：

<li ng-repeat="comment in comments"> 
    {{ comment.comment }} 
</li>

到目前爲止，一切都很好。

我想這樣做，當評論提交給服務器時，$scope.comments屬性更新，更新視圖。我更新了commentsController$scope有一種方法：submitComment它是從ngSubmit指令調用：

app.controller('commentsController', function($scope, comment) { 

    $scope.comments = comment.query(); 

    $scope.submitComment = function() { 
    var commentToSave = new comment(); 
    angular.copy($scope.comment, commentToSave); 
    commentToSave.$save(function() { 
     $scope.comments.push(commentToSave); 
    }); 
    }; 
});

當調用該方法，「意見」被成功發送到服務器但該視圖不能正確更新。回想一下，我的ngRepeat指令是在li上定義的。當我提交「評論」時，會創建一個新的li（即呈現新的項目符號點），但是主體爲空。我究竟做錯了什麼？

更新：我發現，如果我叫$scope.comments.push(commentToSave);外的$save回調，該視圖正確更新。我認爲commentToSave正在改變，當我打電話$save，無論如何。

來源

2015-04-18 Angular noob

你的後端迴應什麼？我認爲$ save函數會更新響應中項目的值，所以如果它爲空，那麼commentToSave的屬性也將爲空。（您可以在瀏覽器開發工具的網絡標籤中查看響應，如果在成功函數中有參數，您可以在javascript中看到響應，'commentToSave。$ save（function（result）{}）;'） – Patrick

您是否定義了' $ scope.comment'？ – Jonas

@帕特里克你撞到了頭上的朋友。我想知道，有沒有辦法禁用這種行爲..？我可以理解這種行爲在許多情況下是如何有用的，但這裏沒有必要。另外，請留下一個答案，我會接受它。 –

的$保存功能從響應更新保存項目的值。所以如果響應是空的，那麼commentToSave的屬性也將是空的。

如果這是您的選擇，您應該從後端返回創建的值。這很有用，因爲在網頁中創建項目時，您通常沒有唯一的標識符。例如，可以在將ID插入數據庫時創建該ID。所以，當你發佈一個新的項目，你迴應與「創建的屬性」，所以你的控制器持有該項目的正確ID。如果您更改任何值並使用$save第二次更新項目，則尤其需要此項。

如果您不想在保存時使用服務器的響應，只需將值複製到新變量，然後在將項目推送到註釋數組時使用該值。我不確定你會如何在$resource工廠中關閉此功能，並且還沒有看到它的任何選項。

來源

2015-04-18 15:32:43 Patrick

謝謝你，帕特里克。正是我需要的:)。 –

有時我從REST apis回來的問題有些問題。所以你的情況我會做這樣的事情：

commentToSave.$save(function(savedComment) { 
    $scope.comments.push(angular.fromJson(savedComment)); 
});

來源

2015-04-18 12:06:40

複製的評論將被沒有改變：

app.controller('commentsController', function($scope, comment) { 

    $scope.comments = comment.query(); 

    $scope.submitComment = function() { 
    var commentToSave = new comment(), commentToDisplay = {}; 
    angular.copy(commentToDisplay, commentToSave); 
    angular.copy($scope.comment, commentToSave); 
    commentToSave.$save(function() { 
     $scope.comments.push(commentToDisplay); 
    }); 
    }; 
});

來源

2015-04-18 12:18:08 KyleK

當使用ngResource模塊時，我的模型沒有正確更新

回答

相關問題