Question

使用AngularFire CRUD应用程序。我的问题是弄清楚如何动态生成重复的项目的firebase引用，所以我可以.remove（）它。想想也许'这个'会有效但不是。我能够推送和编辑，只是坚持如何删除ng-repeat中的内容。

谢谢，

应用程序位于此处：http://powerful-stream-7060.herokuapp.com/#/admin

HTML

        <div id="team" ng-hide ng-repeat="teamMember in team">
            <h4><div ng-model="teamMember.name" contentEditable>{{teamMember.name}}</div></h4>
            <code><div ng-model="teamMember.imgUrl" contentEditable>{{teamMember.cost | noFractionCurrency}}</div></code>
            <p><div ng-model="teamMember.position" contentEditable></div></p>
            <button ng-click="removeItem()" style="color:red;">[x]</button>
        </div>

JS

        var teaUrl = new Firebase("https://eco-grow.firebaseio.com/team");
        angularFire(teaUrl, $scope, "team");
        $scope.teammate = {};
        $scope.teammate.name = "";
        $scope.teammate.position = "";
        $scope.teammate.imgUrl = "";

        $scope.scout = function() {
             teaUrl.push($scope.teammate);
        }
        $scope.removeItem = function () {
            $scope.ref().remove(this);
        };

Answer 1

假设团队是一个队友对象数组，只要$ scope.team仍然绑定，你应该能够将队友项目从数组中拼接出来。您可能必须传递项目的ngRepeat $index。 $scope.removeItem = function (itemindex) { $scope.team.splice(itemindex,1); };

另请注意，angularFire是异步的并返回一个promise，$ scope.team在声明其他函数时可能仍然为空。您可能想要使用angularFire(teaUrl, $scope, "team").then(function(cb){ do stuff with $scope.team & cb() to unbind})

Answer 2

您可以使用传递给removeItem方法的索引删除项目，如下所示：

<div id="team" ng-hide ng-repeat="teamMember in team">
            <h4><div ng-model="teamMember.name" contentEditable>{{teamMember.name}}</div></h4>
            <code><div ng-model="teamMember.imgUrl" contentEditable>{{teamMember.cost | noFractionCurrency}}</div></code>
            <p><div ng-model="teamMember.position" contentEditable></div></p>
            <button ng-click="removeItem({{$index}})" style="color:red;">[x]</button>
        </div>

并从团队数组中删除该项目。

$scope.removeItem = function (index) {
            $scope.team.splice(index, 1);
        };

Answer 3

我就是这样做的。看起来更干净，但我喜欢之前提出的$index。

<div id="team" ng-hide ng-repeat="(ref, teamMember) in team">
      <button ng-click="removeItem(ref)" style="color:red;">[x]</button>
</div>

Answer 4

您可以使用该项目的容器，例如AngularFire Quickstart中的示例（点击＆＃34; index.html＆＃34;）：

<button ng-click="team.$remove(teamMember)">Delete team member</button>

从Angular重复获取Firebase引用

4 个答案: