如何使用Firebase + Angular编辑数组中的对象

时间:2014-09-28 11:41:55

标签: angularjs angularjs-scope firebase angularfire firebasesimplelogin

在我的Firebase + Angular(使用AngularFire)应用程序中,我有一个对象数组,这些对象被格式化为带有ng-repeat的表格。每行都是不同的对象。

我想添加选项以将特定对象“分配”给当前使用Firebase简单登录登录的用户。我添加了与deleteItem(item)类似的函数assignTo(item),但这对我不起作用。

我做错了什么?

<div ng-controller="itemsCtrl">
  <table>
    <tr ng-repeat="item in items">
    <!-- table row aka object starts here -->
    <td>
      {{ item.assignedTo}}
    </td>
    <td>
      <form ng-submit="assignTo(item)">
       <button ng-click="items.$save(item)"class="btn btn-default">Assign</button>
      </form>               
        </td>
        <td>
          <form ng-submit="deleteItem(item)">
        <button ng-click="items.$remove(item)">Remove</button>
        </form>
      </td>
    </tr>
  </table>
</form>
<!-- table row aka object ends here -->
...
</div>

这是我的控制器

app.controller("itemsCtrl", ["$scope", '$rootScope', "$firebase", "simpleLogin",
   function($scope, $rootScope, $firebase, simpleLogin) {
     var ref = new Firebase("https://--------.firebaseio.com/");
     $scope.items = [];
     var sync = $firebase(ref);
     $scope.items = sync.$asArray();
     $rootScope.auth = simpleLogin;

    ...

     $scope.assignTo = function(assignedTo) {
       $scope.items[i].assignedTo = $rootScope.auth.user.displayName;
       $scope.items[i].$save(i)
     };
   }
 ]);

更新:这解决了问题

<tr ng-repeat="(key, item) in items">
...
<td>
<button ng-click="assignTo(key)" class="btn btn-default">Assign</button>
</td>

 $scope.assignTo = function(key) {
   console.log($scope.items[key].assignedTo);
   $scope.items[key].assignedTo = $rootScope.auth.user.displayName;;
   $scope.items.$save(key);
 };

1 个答案:

答案 0 :(得分:0)

由于您在此处使用数组,因此使用(key, item)并不理想(这是迭代对象的构造)。

Angular在上面的示例中提供了代表$index的特殊i变量:

<button ng-click="assignTo($index)">Assign</button>

此外,您在拨打电话时已经拥有该项目,因此无需按键或索引查找该项目($ save也会接受实际项目代替索引):

<tr ng-repeat="item in items">
  <td>
    <button ng-click="assignTo(item)">Assign</button>
  </td>

$scope.assignTo = function(item) {
   item.assignedTo = $rootScope.auth.user.displayName;;
   $scope.items.$save(item);
 };