angularFire无法$向firebase添加数据

I am using angularFire and trying to save data from a form to firebase with $add. Any help would be greatly appreciated. The console logs all work, I am able to retrieve the data in the console. Sorry for all of the code... I wanted to be sure I provided all the material needed.

我正在使用angularFire并尝试使用$ add将表单中的数据保存到firebase。任何帮助将不胜感激。控制台记录所有工作，我能够在控制台中检索数据。对不起所有的代码...我想确保我提供了所需的所有材料。

app.js:

app.js：

    var creativeBillingApp = angular.module('creativeBillingApp', ['ngRoute', 'firebase']);

    creativeBillingApp.constant('FIREBASE_URI', "https://XXXX.firebaseIO.com/");

    creativeBillingApp.controller('MainCtrl', ['$scope', 'groupsService', function( $scope,  groupsService, $firebase ) {

    console.log('Works')


    $scope.newGroup = {
     name: '',
     status: ''

    };

   $scope.addGroup = function(newGroup){

   console.log(newGroup);

groupsService.addGroup();
  $scope.newGroup = {
    name: '',
    status: ''

  };
};
 $scope.updateGroup = function (id) {
   groupsService.updateGroup(id);
 };

 $scope.removeGroup = function(id) {
   groupsService.removeGroup(id);
 };
}]);




creativeBillingApp.factory('groupsService', ['$firebase', 'FIREBASE_URI',
  function ($firebase, FIREBASE_URI) {
    'use strict';
    var ref = new Firebase(FIREBASE_URI);
    return $firebase(ref).$asArray();

var groups = $firebase(ref).$asArray();

var getGroups = function(){
  return groups;
};

var addGroup = function (newGroup) {
  console.log(newGroup)
  groups.$add(newGroup);
};

var updateGroup = function (id){
  groups.$save(id);
};

var removeGroup = function (id) {
  groups.$remove(id);
};
return {
  getGroups: getGroups,
  addGroup: addGroup,
  updateGroup: updateGroup,
  removeGroup: removeGroup,
}

}]);

index.html:

index.html的：

         <form role="form" ng-submit="addGroup(newGroup)">
            <div class="form-group">
              <label for="groupName">Group Name</label>
              <input type="text" class="form-control" id="groupName" ng-model="newGroup.name">
            </div>
            <div class="form-group">
              <label for="groupStatus">Group Status</label>
              <select class="form-control" ng-model="newGroup.status">
                <option value="inactive">Inactive</option>
                <option value="active">Active</option>
              </select>
            </div>
           <button type="submit" class="btn btn-default">Submit</button>
          </form>

This is the error I am getting:

这是我得到的错误：

TypeError: undefined is not a function
at Scope.$scope.addGroup (http://localhost:9000/scripts/app.js:35:19)

and the app.js line 35 is in reference to groupsService.addGroup(); from the app.js code given above.

app.js第35行是对groupsService.addGroup（）的引用;从上面给出的app.js代码。

1 个解决方案

#1

Firstly, you are returning in your service after you create your $FirebaseArray. You are also creating another $FirebaseArray after that.

首先，在创建$ FirebaseArray后，您将返回自己的服务。之后你还要创建另一个$ FirebaseArray。

return $firebase(ref).$asArray();

Remove that return statement. That is causing your service to return early and none of the attached methods will apply to your service.

删除该return语句。这导致您的服务提前返回，并且所有附加方法都不适用于您的服务。

In groupService.addGroup() you are calling push, which is not a function on $asArray. You need to call .$add(). The newGroup argument is also not being passed in the controller.

在groupService.addGroup（）中，您调用的是push，它不是$ asArray上的函数。你需要打电话。$ add（）。 newGroup参数也未在控制器中传递。

The $.push method is available on the base of the $firebase binding. When you using a $FirebaseArray the $add method pushes a new record into Firebase.

$ .push方法在$ firebase绑定的基础上可用。当您使用$ FirebaseArray时，$ add方法会将新记录推送到Firebase。

See the docs for more info.

有关详细信息，请参阅文档。

Plunker Demo

Plunker演示

var addGroup = function (newGroup) {
  console.log(newGroup)
  groups.$add(newGroup);
};

Then in your controller you can simply call:

然后在您的控制器中，您只需拨打：

$scope.addGroup = function(newGroup){
  groupsService.addGroup(newGroup);

  $scope.newGroup = {
    name: '',
    status: ''
  };
};

#1