如何使用$ resource保存后从$ scope ng-repeat更新项目

时间:2013-04-09 10:58:35

标签: angularjs angularjs-ng-repeat angularjs-service angular-resource

我有一个角度视图,显示项目列表,每个项目都有两个按钮,用于设置暂停/开始时的每个广告系列。我知道它是角度$资源的一个非常基本的问题,但我无法在成功$ start时更新项目(在成功回调中我无法访问与该项目相关的任何内容)。

function CampaignsListCtrl($scope, Campaign, $resource) {
    $scope.campaigns = Campaign.query();

    $scope.startCampaign = function () {
        var c = new Campaign(this.campaign);
        c.status = 1;
        c.$start(function success(response) {
               //here I'd like to update the value but can't access the item.
               //for example this.campaign.status = 1 doesn't work
               //how can I access the ng-repeat item to update it on success $start?
               //the response represents the updated Object

               console.log (response);

        }, function error (response) {
           console.log (response)
        });
    }

    $scope.pauseCampaign = function () {
        var c = new Campaign(this.campaign);
        c.status = 0;
        c.$pause(function success(response) {
               console.log (response);

        }, function error (response) {
           console.log (response)
        });
    }

}
//// and Campaign is defined as factory
mongoAPI.
factory('Campaign', ['$resource', '$http', function($resource, $http) {
        var actions = {
            'start': {method:'POST'},                           
            'pause': {method:'POST'}                 
        }
        var res = $resource('/api/campaign.js',{}, actions)
        return res;
}]);

在观点中我有:

<div ng-repeat="campaign in campaigns">
     <button type="button" ng-show="campaign.status==0" ng-click="startCampaign(campaign)" class="btn"><i class="icon-play"></i></button>
     <button type="button" ng-show="campaign.status==1" ng-click="pauseCampaign(campaign)" class="btn"><i class="icon-pause"></i></button>
</div>

1 个答案:

答案 0 :(得分:1)

这是一个与闭包/范围相关的问题,而不是Angular本身。在成功处理程序内部,this不再是范围,因此无法访问this.campaign。你实际上可以通过多种方式解决这个问题。

我相信这些简单的内容是接收campaign作为参数,并从那里引用它:

您已经在HTML中使用了这个:

ng-click="startCampaign(campaign)"

所以接收并使用它:

$scope.startCampaign = function (campaign) {
    var c = new Campaign(campaign);
    c.$start(function success(response) {
      campaign.status = 1;
    },
    ...
};