使用angularjs將數據添加到firebase中

我試圖使用angularjs將數據添加到firebase數據庫中，但是當單擊添加按鈕時沒有任何反應，並且函數未調用，並且控制檯中沒有出現錯誤。我的代碼中的問題在哪裏？使用angularjs將數據添加到firebase中

addPost.html

<body ng-controller="AddPostCtrl"> 

<div class="blog-masthead"> 
    <div class="container"> 
     <nav class="blog-nav"> 
      <a class="blog-nav-item " href="#">Home</a> 
      <a class="blog-nav-item active" href="addPost.html">Add Post</a> 

     </nav> 
    </div> </div> 

<div class="container"> 


    <form class="form-horizontal" ng-submit="AddPost()"> 
     <fieldset> 

      <!-- Form Name --> 
      <legend>Create Post</legend> 

      <!-- Text input--> 
      <div class="form-group"> 
       <label class="col-md-4 control-label" for="txtTitle">Post</label> 
       <div class="col-md-4"> 
        <input id="txtTitle" name="txtTitle" ng-model="article.title" type="text" placeholder="Post name" class="form-control input-md"> 

       </div> 
      </div> 

      <!-- Textarea --> 
      <div class="form-group"> 
       <label class="col-md-4 control-label" for="txtPost">Description</label> 
       <div class="col-md-4"> 
        <!--<textarea class="form-control" id="txtPost" name="txtPost"></textarea>--> 
        <textarea class="form-control" id="txtPost" ng-model="article.post" name="txtPost" ></textarea> 
       </div> 
      </div> 

      <!-- Button --> 
      <div class="form-group"> 
       <label class="col-md-4 control-label" for="singlebutton"></label> 
       <div class="col-md-4"> 
        <!--<input id="singlebutton" name="singlebutton" class="btn btn-primary" type="submit" value="Add" />--> 
        <input id="singlebutton" ng-disabled="!article.title || !article.post" name="singlebutton" class="btn btn-primary" type="submit" value="Add" /> 

       </div> 
      </div> 

     </fieldset> 
    </form> 


</div> 

</body>

addPost.js

index.html中

'use strict'; 

angular.module('myApp.addPost', ['ngRoute']) 
    .config(['$routeProvider', function($routeProvider) { 
     $routeProvider.when('/addPost', { 
      templateUrl: 'addPost/addPost.html', 
      controller: 'AddPostCtrl' 
     }); 
    }]).controller('AddPostCtrl', ['$scope','$firebase',function($scope,$firebase) { 
     console.log("This was called."); 
     $scope.AddPost = function(){ 
      var title = $scope.article.title; 
      var post = $scope.article.post; 
      var firebaseObj = new Firebase("https://xxxxxx.firebaseio.com/"); 
      var fb = $firebase(firebaseObj); 
      fb.$push({ title: title,post: post}).then(function(ref) { 
       console.log(ref); 
      }, function(error) { 
       console.log("Error:", error); 
      }); 

     } 
    }]);

腳本

<script src="bower_components/angular/angular.js"></script> 
    <script src="bower_components/angular-route/angular-route.js"></script> 
    <script src="app.js"></script> 
    <script src="addPost/addPost.js"></script> 
    <script src="https://cdn.firebase.com/js/client/2.0.4/firebase.js"></script> 
    <script src="https://cdn.firebase.com/libs/angularfire/0.8.0/angularfire.min.js"></script> 
    <script src="https://cdn.firebase.com/js/simple-login/1.6.2/firebase-simple-login.js"></script>

來源

2016-03-18 AdnroidD

這是一箇舊項目嗎？爲什麼你使用這種舊版本的Firebase庫？ –

您的問題是異步加載...你的腳本後加載的火力點.js ....你想加載它後像這樣：

 <script src="bower_components/angular/angular.js"></script> 
     <script src="bower_components/angular-route/angular-route.js"></script> 
     <script src="https://cdn.firebase.com/js/client/2.0.4/firebase.js"></script> 
     <script src="https://cdn.firebase.com/js/simple-login/1.6.2/firebase-simple-login.js"></script> 
     <script src="https://cdn.firebase.com/libs/angularfire/0.8.0/angularfire.min.js"></script> 
     <script src="app.js"></script> 
     <script src="addPost/addPost.js"></script>

所以現在它實際上知道由AngularFire和Firebase提供的方法和變量......您導入的所有東西基本上都是Js文件。它先通過角然後是Firebase，然後是Angularfire（需要在Firebase之後導入和AngularFire所以它從它們接收變量和方法），然後finnaly你的腳本將使用所有可用的庫。希望這是有道理的。

來源

2016-03-18 00:30:04 amanuel2

我試過了，沒有工作：/ @Dsafds – AdnroidD

Ok @merna你在控制檯上看到了什麼？任何404 Erros？如果不是你得到什麼錯誤？如果你的控制檯沒有看到錯誤，那麼最新的問題是什麼？ – amanuel2

沒什麼，我應該看到「這被稱爲」。如果函數調用,,我認爲這意味着有問題的形式或我的Html，但我沒有找到它！ @Dsafds – AdnroidD

使用angularjs將數據添加到firebase中

回答

相關問題