无法使用AngularFire $ remove()删除元素

时间:2015-02-14 00:16:19

标签: angularjs firebase angularfire

我正在尝试从我的数据库中删除一个项目(圆形)。我可以在console.log中使用$ id,但是当我尝试roundsList。$ remove(round.id)时它没有做任何事情。我再一次彻底迷茫......

JS:

.controller('RoundsCtrl', ['$scope', '$firebase', 'FBURL', function ($scope, $firebase, FBURL, url) {
var roundsRef = new Firebase(FBURL + 'rounds');
var roundsList = $firebase(roundsRef).$asArray();
var usersRef = new Firebase(FBURL + 'users');
var usersRef = usersRef.child($scope.loggedInUserID).child('rounds');
var usersRounds = $firebase(usersRef).$asArray();



$scope.removeItem = function (index, round, event) {
    // Avoid wrong removing
    if (round.$id == undefined) return;
    // Firebase: Remove item from the list
    $scope.roundsList.$remove(round.$id);
};

/* SET DEFAULT FOR TOGGLE TO COLLAPSED*/
$scope.isCollapsed = true;

/* ONCE ROUNDS ARE LOADED RETURNS ROUNDS BY ID FOR INDIVIDUAL USER*/
usersRounds.$loaded()
    .then(function (data) {
        $scope.rounds = data.map(function (item) {
            console.log(item);
            console.log(item.$id);
            return roundsList.$getRecord(item.roundID);
        });
    });}])

HTML:

<tbody ng-repeat="round in rounds | orderBy:orderBy">
            <tr>
                <td>
                    {{round.date}}
                </td>
                <td>
                    {{round.courseName}}
                </td>
                <td>
                    {{round.courseID}}
                </td>
                <td>
                    {{round.user}}
                </td>
                <td>
                    {{round.userID}}
                </td>
                <td>
                    {{round.tags}}
                </td>
                <td>
                    <a href="#/roundDetail/view/{{round.$id}}" class="btn btn-primary">View</a>
                    <a href="#/roundDetail/edit/{{round.$id}}" class="btn btn-primary">Edit</a>
                    <button class="btn btn-danger" ng-click="isCollapsed = !isCollapsed">Delete</button>
                </td>
            </tr>
            <tr collapse="isCollapsed">
                <td colspan="7">
                    <div>
                        <div class="well well-lg">
                            <p>Are you sure? This cannot be undone!</p>
                            <button ng-click="removeItem($index, round, $event)" class="btn btn-danger">Delete Round</button>
                            <button ng-click="isCollapsed = !isCollapsed" class="btn btn-info">Cancel</button>

                        </div>
                    </div>
                </td>
            </tr>
        </tbody>

修改

我终于可以使用以下代码从两个DB中删除了。希望它可以帮助其他人。

/* DELETES ROUND FROM MAIN ROUND DATABASE AND FROM USER SPECIFIC DB*/
var roundsListSync = $firebase(roundsRef);
var usersRoundsListSync = $firebase(usersRefRounds);
$scope.removeItem = function (index, round, event) {
    roundsListSync.$remove(round.$id);
    //console.log(usersRounds);
    var i = 0;
    var len = usersRounds.length;
    for (; i < len;) {
        console.log(usersRounds[i].roundID);
        if (usersRounds[i].roundID === round.$id) {
            var usersRoundsID = usersRounds[i].$id;
            //console.log(usersRoundsID);
            usersRoundsListSync.$remove(usersRoundsID);
            i++;
        } else {
            i++;
        }
    }
};

1 个答案:

答案 0 :(得分:1)

您正在调用$scope.roundsList.$remove(round.$id),但是您尚未在范围内声明roundsList:var roundsList = $firebase(roundsRef).$asArray();请尝试使用var roundsList = $firebase(roundsRef).$asArray()

如果这不起作用,请尝试制作不是数组的firebase引用:

var roundsListSync = $firebase(roundsRef);
roundsListSync.$remove(round.$id);