I've been struggling to retrieve my to-do tasks from a firebase database, but unfortunately, no data is appearing on my view. Surprisingly, there are no errors showing up in the console.
My journey led me to the point of "saving data" in firebase.
Here's the code snippet that I've been working on:
var app = angular.module('starter', ['ionic', 'firebase']);
var fb = null;
app.run(function($ionicPlatform) {
$ionicPlatform.ready(function() {
if(window.cordova && window.cordova.plugins.Keyboard) {
cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
cordova.plugins.Keyboard.disableScroll(true);
}
if(window.StatusBar) {
StatusBar.styleDefault();
}
var config = {
apiKey: "...",
authDomain: "...",
databaseURL: "...",
storageBucket: "...",
messagingSenderId: "..."
firebase.initializeApp(config);
});
});
app.controller('TodoCtrl', function($firebaseObject,$scope, $ionicPopup){
$scope.list = function(){
var user = firebase.auth().currentUser;
if(user != null){
alert('user ' + user.uid + ' exists!');
var ref = firebase.database().ref('/users/').child(user.uid);
var syncObject = $firebaseObject(ref);
syncObject.$bindTo($scope, "data");
}else{
alert('error');
}
}
$scope.create = function() {
var user = firebase.auth().currentUser;
$ionicPopup.prompt({
title: 'Enter a new TODO item',
inputType: 'text'
})
.then(function(result) {
if(result !== "") {
firebase.database().ref("/users/").child(user.uid).push({
todos: result
});
}
});
}
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ion-view view-title="Todo" ng-init="list()">
<ion-nav-buttons side="right">
<button class="right button-icon icon ion-plus" ng-click="create()" ></button>
</ion-nav-buttons>
<ion-content>
<div class="list">
<div ng-repeat="todo in data.todos" class="item">
{{todo.todos}}
</div>
</ion-content>
</ion-view>
Check out my Firebase database here
Thank you in advance for your valuable assistance.