Question

我正在尝试解决如何更新存储在Firebase中的项目。我设法让它达到了我可以创建和删除项目的程度。我现在想编辑和更新现有项目。我的项目在页面上重复出现，每个项目旁边都有一个“编辑”按钮。

HTML

<form>
  <input type="text" placeholder="Enter title here" ng-model="editedProvider.title">
  <button type="submit" ng-click="updateProvider(provider.name)">Submit</button>
</form>

我正在将项目添加到我的列表中，如下所示：

JS

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

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

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

我无法弄清楚如何更新此项目。我有一个更新提供程序函数，如下所示：

$scope.updateProvider = function(name) {
  providersRef.child(name).update({
    title: snapshotVal.title
  });
};

但是在控制台中显示此错误：

错误：Firebase.child失败：第一个参数是无效路径：“undefined”。路径必须是非空字符串，不能包含“。”，“＃”，“$”，“[”或“]”

我尝试创建一个函数，找到使用snapshot.name()对我正在编辑的项目进行检查，以使用新值更新title，但它似乎没有工作

知道我做错了吗？

我已经设置了Plunker over here。感谢你对我做错的任何帮助。

Answer 1

您认为的相关HTML是：

  <div ng-show="shouldShowEditing()">
    <h3>Editing {{ editedProvider.title }}</h3>
    <form role="form" name="addPlaceForm">
      <div class="form-group">
        <input type="text" placeholder="Enter title here" ng-model="editedProvider.title">
      </div>

      <div class="form-group">
        <button type="submit" class="btn btn-primary btn-lg" ng-click="updateProvider(provider.name)">Submit</button>
      </div>
    </form>
    <button type="button" class="btn btn-default" ng-click="cancelEditing();">Cancel</button>
  </div>

更新

解决了名称传递问题后，下一条错误消息是：

ReferenceError：未定义snapshotVal

这一点也非常明确：您的updateProvider代码会从其中一个Firebase侦听器进行复制/粘贴，并引用不存在的snapshotVal。相反，它应该从Angular范围获得新标题：

$scope.updateProvider = function(name) {
  providersRef.child(name).update({
    title: $scope.editedProvider.title
  });
};

从Firebase更新项目

1 个答案:

更新