在 AngularJS 中单击时更新 Firebase 中的字段

Question

我有一个 table 从 Firebase 中提取数据。 table 中的每一行都有可以单击以执行特定功能的操作。其中一项操作是简单地将行设置为已完成。我的 firebase 数据库中有一个字段，其中包含 true 或 false 的键，用于 read 值。我需要能够单击图标（复选标记）并根据操作更新 firebase 中的值。

到目前为止我有以下内容：

var myProducts = new Firebase('https://url-to-firebase-db/products');
$scope.products = $firebaseArray(myProducts);

$scope.products = $firebaseArray(ref);
$scope.markCompleted = function markCompleted(product) {
    product.read = !product.read;
    $scope.products.$save(product);
};

在UI端：

<tbody ng-controller="ProductsCtrl">
    <tr ng-repeat="product in products | orderBy: 'category'">
    <td>{{ product.category}}</td>
    <td>{{ product.task}}</td>
    <td><img class="user" src="{{ product.user }}"></td>
    <td>{{ product.status }}</td>
    <td>{{ product.due | date:'MMMM dd' }}</td>
    <td>{{ product.notes }}</td>
    <td>{{ product.read }}<a class="fa fa-check" ng- 
                          click="markCompleted(product)"></a>
    <i class="fa fa-comment"></i>
    <i class="fa fa-bars"></i>
    </td>
    </tr>
</tbody>

虽然我不确定如何触发更新 Firebase 中的字段的操作。

Answer 1

尝试创建一个接受 product 的方法，并在您的模板中指定它：

<tbody ng-controller="ProductsCtrl">
  <tr ng-repeat="product in products | orderBy: 'category'">

    <td>
      <button class="fa fa-check" ng-click="markCompleted(product)" >   
      </button>
    </td>

  </tr>
</tbody>

然后在您的控制器中您可以更改 product.read 值，并使用 $firebaseArray:

保存它

$scope.products = $firebaseArray(ref);
$scope.markCompleted = function markCompleted(product) {
  product.read = !product.read;
  $scope.products.$save(product);
};

在 AngularJS 中单击时更新 Firebase 中的字段

Updating field in Firebase on click in AngularJS

javascript

angularjs

firebase

angularfire