从Firebase移除物品

Question

我试图了解如何从Firebase中删除项目。我已经建立了一个函数（createProvider）创建一个项目，但无法弄清楚如何删除一个项目。

HTML

<form role="form" name="createProviderForm">
    <input type="text" ng-model="title">
    <button type="submit" ng-click="createProvider()">Submit</button>
</form>

<div ng-repeat="provider in providers">
    <h3>{{ provider.title }}</h3>
    <button type="button" ng-click="removeProvider()">Remove</button>
  </div>
</div>

JS

var rootRef = new Firebase(FBURL);
var providersRef = rootRef.child('providers');

$scope.newProvider = {};
$scope.providers = [];

providersRef.on('child_added', function(snapshot) {
  $timeout(function() {
    var snapshotVal = snapshot.val();
    console.log(snapshotVal);
    $scope.providers.push({
      title: snapshotVal.title
    });
  });
});

$scope.createProvider = function() {
  var newProvider = {
    title: $scope.title
  };
  providersRef.push(newProvider);
};

$scope.removeProvider = function() {

};

我已经removeProvider尽力创建了一个名为的函数，但无法计算出要放入其中的内容。我意识到我必须以某种方式定位特定项目，然后将其从列表中删除。我只是不确定如何。

任何帮助，将不胜感激。提前致谢！

Answer 1

要从Firebase中删除项目，您需要知道它name()，它是在您调用push()将新项目添加到Firebase 时自动为您生成的。

因此，您需要将名称绑定到范围：

$scope.providers.push({
  name: snapshot.name(),
  title: snapshotVal.title
});

然后，您将此名称removeProvider从HTML 传递到您的呼叫中：

<div ng-repeat="provider in providers">
    <h3>{{ provider.title }}</h3>
    <button type="button" ng-click="removeProvider(provider.name)">Remove</button>
</div>

并使用它调用removeFirebase：

$scope.removeProvider = function(name) {
  providersRef.child(name).remove();
};

正如@SharpieOne所评论的那样，如果您使用AngularFire库（在本例中为它的$asArray()方法），则将自动为您处理此以及其他许多事情。