0

我的数据库中有一堆“活动”：

{"name" : "Apple", "status" : "active"}
{"name" : "Orange", "status" : "paused"}

我已经在 Angular 中展示了它们：

<span ng-switch on="campaign.status"> 
<a ng-switch-when="active" ng-click='setStatus($index, "paused")'>Pause</a>
<a ng-switch-when="paused" ng-click='setStatus($index,"active")'>Activate</a>
</span>

然后在我的控制器中，我使用 API 更新服务器数据库的状态（返回更新条目的 JSON。

$scope.setStatus = function(index, newstatus) {

    var item = $scope.campaigns[index];
    var url = 'api.mysite.com/' + newstatus + '/' + item._id.$oid;

    if (! $scope.isComplete(item) )
    {
        $http({method: 'GET', url: url}).  
        success(function(data, status, headers, config) { 
           $scope.campaigns[index] = data; 
          }). error(function(data, status, headers, config) {
           console.log('Error communicating with the server.');
          }); 
    }
}

其中变量campaigns是控制器初始化时从服务器检索到的所有活动的数组：

$scope.connection = $resource('api.mysite/getallcampaigns');
$scope.campaigns = $scope.connection.query();

这看起来已经很乱了，我很确定我使用AngularJS不正确:(主要是我将我正在修改的元素的索引传递给控制器​​，如果我重新排序数组，它会中断. 我怎样才能让 Angular 为我很好地连接它？做到这一点的最小和正确的方法是什么？

4

1 回答 1

0

将活动传递到 setStatus() 而不是索引。修改成功回调中的活动属性：

<a ng-switch-when="active" ng-click='setStatus(campaign, "paused")'>Pause</a>

.

$scope.setStatus = function (campaign, newstatus) {
   ...
   success(function(data, status, headers, config) { 
       campaign.status = data.status;

不要在成功回调中重新分配整个数组——这可能会破坏您视图中的数据绑定。
即，我认为这行不通：campaign = data

您可能可以定义一个 $resource 对象，它可以处理获取初始数据数组和修改单个数组项。请参阅$resource API 页面上的“信用卡资源”示例。请注意数组的每一项cards（分配了 query() 的结果）也可以是 $save()d。

于 2013-01-26T06:28:49.513 回答