Hi, folks. This is my first time asking a question like this, so I’m hoping I can provide as much info as I can, but if there’s something confusing, please let me know and I’ll try to clarify it.
I’m using Ionic Creator to create a todo list of sorts using firebase and right now, I’m trying to implement a reorder function. I’ve been able to reorder the items with no issue, but the new reordered list never seems to save the new order or persist. I understand, after looking into it, that I need to find a way to make the reordered items persist in storage, but I’m not quite sure how.
I’ll post some code below and I hope it helps provide some insight. Again, this is my first time asking a question like this, so if there’s something obvious I’m missing, I would appreciate the feedback.
If it may also help, I followed these guides for reference for creating my app, if that may assist with providing any insight at all.
main home page
function ($scope, $stateParams, Todos, $ionicModal) {
$scope.showReorder = false;
$scope.toggle = function(v){
$scope[v] = !$scope[v];
}
$scope.reorder = function(item, fromIndex, toIndex){
$scope.items.splice(fromIndex, 1);
$scope.items.splice(toIndex, 0, item);
}
$scope.items = Todos.items;
$scope.data = {
'title': ''
}
$scope.modal = $ionicModal.fromTemplate("<ion-modal-view>" +
"<ion-header-bar class='bar-balanced'>" +
"<h1 class='title'>Add a Movie Title</h1>" +
'<button class="button button-clear" ng-click="closeModal()">Close</button>' +
"</ion-header-bar>" +
"<ion-content class='padding'>" +
"<label class='item item-input'><input type='text' placeholder='Title' ng-model='data.title' /></label>" +
"<button ng-click='addItem()' class='button button-balanced button-block'>Submit</button>" +
"</ion-content>" +
"</ion-modal-view>", {
scope: $scope,
animation: 'slide-in-up'
})
$scope.showModal = function(){
$scope.modal.show();
}
$scope.closeModal = function(){
$scope.data.title = '';
$scope.modal.hide();
}
$scope.addItem = function(){
Todos.addItem($scope.data.title);
$scope.closeModal();
}
}
todos.js
angular.module('todos', ['firebase'])
.run(function(){
// Initialize Firebase
var config = {
apiKey: (removed for posting purposes)
authDomain: (removed for posting purposes)
databaseURL: (removed for posting purposes)
storageBucket: (removed for posting purposes)
};
firebase.initializeApp(config);
})
.service('Todos', ['$firebaseArray', function($firebaseArray){
var ref = firebase.database().ref().child('todos');
var items = $firebaseArray(ref);
var todos = {
'items': items,
addItem: function(title){
items.$add({
'title': title,
'finished': false
});
},
setFinished: function(item, newV){
item.finished = newV;
items.$save(item);
}
}
return todos;
}]);