Firebase ReferenceError：未定义Firebase

我正在使用样板Angular-seed和Firebase的Angular教程。我得到的错误是：ReferenceError: Firebase is not defined。Firebase ReferenceError：未定义Firebase

这是我contact.js其中被引用我的错误：

'use strict'; 

angular.module('myContacts.contacts', ['ngRoute','firebase']) 

.config(['$routeProvider', function($routeProvider) { 
    $routeProvider.when('/contacts', { 
    templateUrl: 'contacts/contacts.html', 
    controller: 'ContactsCtrl' 
    }); 
}]) 

// Contacts Controller 
.controller('ContactsCtrl', ['$scope', '$firebaseArray', function($scope, $firebaseArray) { 
    // Init Firebase 
    var ref = new Firebase('https://mycontacts-app.firebaseio.com/contacts'); 

    // get Contacts 
    $scope.contacts = $firebaseArray(ref); 
    console.log($scope.contacts); 


}]);

这是我app.js

这是我指数.html

<!DOCTYPE html> 
<!--[if lt IE 7]>  <html lang="en" ng-app="myContacts" class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]--> 
<!--[if IE 7]>   <html lang="en" ng-app="myContacts" class="no-js lt-ie9 lt-ie8"> <![endif]--> 
<!--[if IE 8]>   <html lang="en" ng-app="myContacts" class="no-js lt-ie9"> <![endif]--> 
<!--[if gt IE 8]><!--> <html lang="en" ng-app="myContacts" class="no-js"> <!--<![endif]--> 
<head> 
    <meta charset="utf-8"> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
    <title>MyContacts App</title> 
    <meta name="description" content=""> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <link rel="stylesheet" href="bower_components/foundation/css/foundation.css"> 
    <link rel="stylesheet" href="app.css"> 

</head> 
<body> 
    <div class="container"> 
    <div class="row"> 
     <div class="large-12 columns"> 
     <h1>myContacts</h1> 
     <hr> 
     </div> 
    </div> 
    <div ng-view></div> 
    </div> 

    <!--[if lt IE 7]> 
     <p class="browsehappy">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p> 
    <![endif]--> 

    <!-- In production use: 
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/x.x.x/angular.min.js"></script> 
    --> 
    <script src="bower_components/jquery/dist/jquery.js"></script> 
    <script src="bower_components/angular/angular.js"></script> 
    <script src="bower_components/angular-route/angular-route.js"></script> 
    <script src="bower_components/firebase/firebase.js"></script> 
    <script src="bower_components/angularfire/dist/angularfire.js"></script> 
    <script src="bower_components/foundation/js/foundation.js"></script> 
    <script src="app.js"></script> 
    <script src="contacts/contacts.js"></script> 
</body> 
</html>

这是我contact.html

<div class="row" ng-controller="ContactsCtrl"> 
    <div class="large-10 columns"> 
    <h3>Your Contacts</h3> 
    <table> 
     <thead> 
     <tr> 
      <th width="200px">Name</th> 
      <th width="200px">Company</th> 
      <th width="25%">Email</th> 
      <th width="25%">Actions</th> 
     </tr> 
     </thead> 
     <tbody> 
     <tr> 
      <td><a href="#">John Doe</a></td> 
      <td>Some Company</td> 
      <td>[email protected]</td> 
      <td><a href="#" class="button tiny">Edit</a> 
      <a href="#" class="button tiny alert">Delete</a></td> 
     </tr> 
     </tbody> 
    </table> 

    </div> 
    <div class="small-12 large-2 columns"> 
    <a href="#" class="button large">+</a> 
    </div> 
</div>

这些都是我已经从样板角度种子更改的文件。如果有人能帮助，我会很感激。

来源

2017-02-14 David Ramirez

不记得曾经见过'Firebase'构造函数，通常使用['firebase.initializeApp']（https://firebase.google.com/docs/database/web/start#initialize_the_database_javascript_sdk）。你遵循什么文件？ – Phil

您正在查看过时的教程。新版Firebase的功能有所改变。你需要

var app = angular.module('app', ['firebase']); 
app.controller('Ctrl', function($scope, $firebaseArray) { 

    var config = { 
     apiKey: "***", 
     authDomain: "***.firebaseapp.com", 
     databaseURL: "https://***.firebaseio.com", 
     storageBucket: "***.appspot.com", 
     messagingSenderId: "***" 
    }; 
    firebase.initializeApp(config); 

    var ref = firebase.database().ref().child("contacts"); 
    $scope.contacts = $firebaseArray(ref); 
    ... 
});

当然包括firebase.js和angularfire.js到您的index.html：

事情是这样的：

var app = angular.module('app', ['firebase']); app.controller('Ctrl', function($scope, $firebaseArray) { var ref = new Firebase('https://...'); $scope.contacts = $firebaseArray(ref); ... });

都变成这样但你已经做到了。

我不确定你是否想从数据库中读取数据或更多，但我认为这个例子就足够了。在尝试从教程（尤其是旧教程）实施某些内容之前，请先尝试阅读official documentation。在网络发展的世界里，变化非常频繁。

来源

2017-02-15 10:29:20

Firebase ReferenceError：未定义Firebase

回答

相关问题