如何使用不同的ID在Firebase數據庫中插入項目？

Question

我在firebase上有一個簡單的數據庫，基本上我試圖創建一個代碼來在這個數據庫上插入記錄。我想插入這樣的記錄：

id | lat | lng 
01 | -55 | -10 
02 | -44 | -20 

每個「行」是一個地方（經度和緯度）的新紀錄。

我創建了火力這個例子：

我怎麼能記錄插入到這個「表」正確???因爲當我創建了下面的代碼來實現它，我打的按鈕，它在該表上創建一個不同的ID（我是新來的火力地堡，我沒有得到這個尚未）：

下面是完整的代碼：

<form action="" id="newActivity"> 
<input id="searchTextField" type="text" size="50" placeholder="Enter a location" autocomplete="on" runat="server" /> 
<input type="hidden" id="city2" name="city2" /> 
<input type="hidden" id="cityLat" name="cityLat" /> 
<input type="hidden" id="cityLng" name="cityLng" /> 
<input id="saveForm" name="saveForm" type="submit" value="New Activity"> 
</form> 

<script src="http://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
<script src="https://cdn.firebase.com/js/client/2.3.2/firebase.js"></script> 
<script src="http://maps.googleapis.com/maps/api/js?libraries=places" type="text/javascript"></script> 


<script type="text/javascript"> 
    function initialize() { 
     var input = document.getElementById('searchTextField'); 
     var autocomplete = new google.maps.places.Autocomplete(input); 
     google.maps.event.addListener(autocomplete, 'place_changed', function() { 
      var place = autocomplete.getPlace(); 
      document.getElementById('city2').value = place.name; 
      document.getElementById('cityLat').value = place.geometry.location.lat(); 
      document.getElementById('cityLng').value = place.geometry.location.lng(); 
      //alert("This function is working!"); 
      //alert(place.name); 
      // alert(place.address_components[0].long_name); 

     }); 
    } 
    google.maps.event.addDomListener(window, 'load', initialize); 
</script> 


<script> 



    $(function(){ 

     var rootRef = new Firebase("https://xxxx.firebaseio.com/").ref(); 
     var placesRef = rootRef.child('places'); 


     /** 
     * Data object to be written to Firebase. 
     */ 
     var data = [] 


     $('#newActivity').submit(function(event){ 

      var $form = $(this); 
      console.log("submit to Firebase"); 

      //make the submit disabled 
      //$form.find("#saveForm").prop('disabled', true); 

      //get the actual values that we will send to firebase 
      var cityLatToSend = $('#cityLat').val(); 

      console.log(cityLatToSend); 

      var cityLngToSend = $('#cityLng').val(); 

      console.log(cityLngToSend); 

      //take the values from the form, and put them in an object 


      var newActivity = { 
      "lat": cityLatToSend, 
      "lng": cityLngToSend, 
      } 


      //put the new object into the data array 
      data.push(newActivity); 
      console.log(data); 
      //send the new data to Firebase 

      var newPlaceRef = rootRef.push(); 
      newPlaceRef.set(data); 
      //rootRef.push(data); 



      return false; 

     }) 
    }) 


</script> 

Answer 1

在提交函數中，您沒有提供對列表的引用。

var rootRef = new Firebase("https://xxxx.firebaseio.com/").ref(); 

沒有列表，這裏提供。

var newPlaceRef = rootRef.push(); 
    newPlaceRef.set(data); 

因此，而不是將數據推送到你places清單應用程序中創建了一個自動生成的ID

解決方案

var commentsRef = firebase.database("https://xxxx.firebaseio.com/").ref('places'); 
var newRef = commentsRef.push(); 
newRef .set(data); 

希望這可以幫助您解決您發出一個新的職位的參考。 欲瞭解更多信息，請閱讀官方文檔。

Work with Lists of Data on the Web

Answer 2

試試這個：

var rootRef = firebase.database().ref('places'); 
var count = 0; // will hold the length of places array 
var value = { lat: +new Date(), lng: +new Date()/1000 }; // sample value for lat and lng 
firebase 
    .database() 
    .ref('places') 
    .once('value', value => { // get the length of your places array 
    if (value.val() == null) count = 0; // if no places then set it to 0 
    else count = Object.keys(value.val()).length; // otherwise get its length 
// as array items are stored corresponding to their index , Object.keys() can give its length 
    }) 
    .then(() => { 
    rootRef.child(count + '').update(value).then(// this will push into your array 
     success => { 
     console.log('success'); 
     }, 
     error => { 
     console.log('error'); 
     } 
    ); 
    }); 

這樣，您就可以模仿的Array.push（）

您還可以存儲places.length在火力本身通過創建一個新的領域。這樣，你可以使用該值來代替Object.keys（）。每次添加/刪除到位數組後，只需保持更新該值即可。

但是你應該使用push（）方法。

var data = []; 
var newActivity = { 
     "lat": cityLatToSend, 
     "lng": cityLngToSend, 
     } 
//data.push(newActivity);  don't do this 

rootRef.child('push').push(newActivity) 
//This way you can push into get array . 

希望你明白了。

---

讀this