Question

我开始使用AngularFire，并且遇到了将数据导入Firebase应用程序的一些挑战。我正在为AngularJS和AngularFire / Firebase使用CDN。

这是JS：

var app = angular.module('VoteTrackerApp', ['firebase']);

app.constant('FIREBASE_URI', 'https://XXXXXXXXX.firebaseio.com/');

app.controller('VoteTrackerController', ['$scope', 'VoteTrackingService', function($scope, VoteTrackingService) {
    'use strict';
    $scope.vote = { name: '', tally: 0 };
    $scope.addVotes = function() {
        VoteTrackingService.addVotes($scope.vote);
        $scope.vote = { name: '', tally: '' };
    };
}]);

app.factory('VoteTrackingService', ['$firebase', 'FIREBASE_URI', function($firebase, FIREBASE_URI) {
    'use strict';
    var ref = new Firebase(FIREBASE_URI);
    var votes = $firebase(ref);

    return {
        getVotes: function() {
            return votes;
        },
        addVotes: function(vote) {
            votes.$add(vote);
        }
    };
}]);

这是HTML：

<div ng-app="VoteTrackerApp">
    <div ng-controller="VoteTrackerController">
        <form ng-submit="addVotes()">
            Candidate: <input type="text" ng-model="vote.name" />
            Number of Votes: <input type="text" ng-model="vote.tally" id="tally" /> <input type="submit" value="Add" />
    </form>

    <ul>
        <li ng-repeat="(id, vote) in votes">
            {{vote.name}} has {{vote.tally}} votes
        </li>
    </ul>
</div>

我的控制台显示此错误：

TypeError: undefined is not a function
    at Object.addVotes (http://localhost:9000/scripts/main.js:24:19)
    at k.$scope.addVotes (http://localhost:9000/scripts/main.js:9:29)
    at http://ajax.googleapis.com/ajax/libs/angularjs/1.2.21/angular.min.js:176:88
    at http://ajax.googleapis.com/ajax/libs/angularjs/1.2.21/angular.min.js:193:165
    at k.$eval (http://ajax.googleapis.com/ajax/libs/angularjs/1.2.21/angular.min.js:111:373)
    at k.$apply (http://ajax.googleapis.com/ajax/libs/angularjs/1.2.21/angular.min.js:112:121)
    at HTMLFormElement.<anonymous> (http://ajax.googleapis.com/ajax/libs/angularjs/1.2.21/angular.min.js:193:147)
    at http://ajax.googleapis.com/ajax/libs/angularjs/1.2.21/angular.min.js:31:161
    at q (http://ajax.googleapis.com/ajax/libs/angularjs/1.2.21/angular.min.js:7:290)
    at HTMLFormElement.c (http://ajax.googleapis.com/ajax/libs/angularjs/1.2.21/angular.min.js:31:143)

我感谢社区可以与我分享的任何见解。先感谢您。干杯! ：）

Answer 1

$add引用中没有$firebase方法。您需要在其上调用$asArray()才能获得同步对象。查看the quickstart了解详情。

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

此外，您不需要包装数组。您只需返回它并直接使用API：

app.factory('VoteTrackingService', ['$firebase', 'FIREBASE_URI', function($firebase, FIREBASE_URI) {
    'use strict';
    var ref = new Firebase(FIREBASE_URI);
    return  $firebase(ref).$asArray();
}]);

app.controller('VoteTrackerController', ['$scope', 'VoteTrackingService', function($scope, VoteTrackingService) {
    $scope.vote = { name: '', tally: 0 };
    var votes = VoteTrackingService;
    votes.$add($scope.vote);
}]);

$ add使用angularFire无法正常工作

1 个答案: