Angular Fire:undefined不是函数($ on方法不存在)

时间:2014-12-09 16:29:16

标签: javascript angularjs firebase angularfire

我正在尝试将Firebase数据记录到控制台。但我一直收到undefined is not a function的错误。完整错误如下:

TypeError: undefined is not a function
at Object.childAdded (http://localhost:9000/scripts/services/ProviderService.js:11:22)
at new <anonymous> (http://localhost:9000/scripts/controllers/main.js:118:19)

这就是我的代码目前的样子:

ProviderService.js

angular.module('outcomesApp').service('ProviderService', function(FBURL, $q, $firebase) {
  var providerRef = new Firebase(FBURL).child('providers');
  var fireProvider = $firebase(providerRef).$asArray();

  return {
    childAdded: function childAdded(cb) {
      fireProvider.$on('child_added', function(data) {
        console.log(data);
      });
    },
    ...

main.js

app.controller('MainCtrl', function ($scope, $filter, $timeout, $firebase, FBURL, ProviderService) {
  ProviderService.childAdded(function(addedChild) {
    $scope.providers.push(addedChild);
  });
  ...

此行发生错误:fireProvider.$on('child_added', function(data) {

2 个答案:

答案 0 :(得分:4)

您正在使用过时的AngularFire版本。该版本看起来像0.7,自0.8以来,已经发生了很多变化。 .$on方法已不再存在,因此您接收未定义的错误的原因就在于此。现在使用新版本的Firebase,您可以使用新API将代码重构为几行。

需要管理集合时,请使用新的.$asArray()方法。

使用0.8更新时,.$on()已被删除,并使用.$asArray().$asObject替换。

以前我们必须使用.$on()来收听添加到该集合中的孩子。现在使用.$asArray()我们可以自动更新集合。

angular.module('example').controller('MainCtrl', function($scope, $firebase) {
  var ref = new Firebase('<your-firebase>');

  // using $asArray we automatically have child_added handled for us
  $scope.items = $firebase(ref).$asArray();
});

您也可以轻松地将此数据放入工厂中。

angular.module('example').factory('Items', function($firebase) {
  var ref = new Firebase('<your-firebase>');
  return $firebase(ref).$asArray();
});

angular.module('example').controller('MainCtrl', function($scope, Items) {
  $scope.items = Items;
});

答案 1 :(得分:0)

您是否正在尝试获取承诺数据?我对firebase了解不多,让我们试试吧。你有$ q但没有被使用。如果这个抛出错误,它与服务提供商有关。

function providerReference(){
var deferred = $q.defer(),
providerRef = new Firebase(FBURL).child('providers');
providerRef.then(function(d) {
    var fireProvider = $firebase(d).$asArray();
    deferred.resolve(fireProvider);
}, function(err) {
    console.log('error')
});
return deferred.promise

}

return {
 childAdded: function() {
     return providerReference();
 }

}

在main.js

$scope.providers = [];
ProviderService.childAdded().then(function(addedChild) {
    $scope.providers.push(addedChild);
})