角度火:未定义不是一个函数($on方法不存在)

Angular Fire: undefined is not a function ($on method does not exist)

本文关键字:一个 函数 不存在 方法 on 未定义      更新时间:2023-09-26

我正在尝试将我的 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)

这是我的代码当前的样子:

提供商服务.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);
      });
    },
    ...

主.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) {

您使用的是过时的 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;
});

你想得到承诺数据吗?,我对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();
 }

}

主要.js

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