如何使用angular删除firebase中的json数据对象?

时间:2013-09-23 08:18:43

标签: angularjs firebase

我开发了简单的angular-firebase应用程序,它提供了基本的CRUD功能。

firebase中的

json格式

{
  "-J0wuZ_J8P1EO5g4Xfw6" : {
    "contact" : "56231545",
    "company" : "info",
    "city" : "limbdi",
    "name" : "priya"
  },
  "-J0wrhrtgFvIdyMcSL0x" : {
    "contact" : "65325422",
    "company" : "rilance",
    "city" : "jamnagar",
    "name" : "pihu"
  }
}

用于列出html页面中所有数据的角度代码

<table class='table table-hover'>
    <tr>
        <th>Name</th>
        <th>City</th>
        <th>Company</th>
        <th>Contact</th>
        <th></th>
    </tr>

    <tr ng-repeat="item in employee">
        <td>{{item.name}}</td>
        <td>{{item.city}}</td>
        <td>{{item.company}}</td>
        <td>{{item.contact}}</td>
        <td><button class='btn btn-warning btn-mini' ng-click='delemp(employee[$index])'>X</button></td>
    </tr>
</table>

当有人点击按钮时,它会触发删除功能,该功能将员工的当前索引作为参数。

var myapp = angular.module('myapp',['firebase']);
myapp.controller('MyCtrl', ['$scope', 'angularFireCollection',
  function MyCtrl($scope, angularFireCollection) {

       $scope.delemp=function($current_emp){
          alert($current_emp.name);
    };
  }
]);

此警报框包含当前员工的姓名。我想删除当前的员工行。但我不知道如何使用remove() firebase方法。我已经访问了firebase的文档,所以我得到了一个很好的代码。

var current = new Firebase('https://myurl/employee/-J48go0dwY5M3jAC34Op');
        current.onDisconnect().remove();

但我想动态地制作它,那么如何才能获得当前节点的父ID,如-J48go0dwY5M3jAC34Op

请帮我弄清楚小问题。

2 个答案:

答案 0 :(得分:12)

而不是传递对象,你可以将id传递给你的删除函数。

<li ng-repeat="(key,item) in list">
  <button ng-click="deleteItem(key)">delete</button> {{item.name}} 
</li>

$scope.deleteItem = function(id){
  var itemRef = new Firebase(url + '/' + id);
  itemRef.remove();
}

编辑: 这也有效

<div ng-repeat="item in list">
    <button ng-click="writeID(item)">log id</button>{{item.$id}} {{item}}<hr>
</div>

$scope.writeID = function(o){
  console.log(o.$id);
}

答案 1 :(得分:1)

如果它是firebaseArray,你也可以这样做:

$scope.deleteItem = function(item){
 employee.$remove(item);
}

只需传递要从对象中删除的项目。

注意:它不适用于firebaseObjects。

有用的资料来源:

https://www.firebase.com/docs/web/libraries/angular/api.html#angularfire-firebasearray-removerecordorindex

https://gist.github.com/anantn/4325082