Quantcast
Channel: Ionic Forum - Latest posts
Viewing all articles
Browse latest Browse all 230027

Ionic Creator - Reorder list items persisting in firebase?

$
0
0

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;

}]);

Viewing all articles
Browse latest Browse all 230027

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>