CODEWITHSUNDEEP
angularjsfirebaseionic-framework
chuck280
chuck280

Reputation: 31

Firebase child_added and ng-repeat

I used child_added and ng-repeat to display a list of statuses, this part worked fine, but when I click on one of the statuses in the list i am sent to tab/statuses/ instead of going to tab/statuses/:statusid. Any help would be much appreciated.

app.js

.state('tab.statuses', {
    url: "/statuses",
    views: {
        'tab-statuses': {
            templateUrl: "templates/statuses.html",
            controller: "StatusesController"
        }
    }
})
.state('tab.status', {
    url: "/statuses/:statusid",
    views: {
        'tab-statuses': {
            templateUrl: "templates/status.html",
            controller: 'StatusController'
        }
    }
})

statusescontroller

app.controller('StatusesController', function ($scope, $filter, $state, $ionicListDelegate, $ionicActionSheet, StatusesService) {


$scope.statuses = [];

var ref = new Firebase("https://app85.firebaseio.com/statuses");

ref.on("child_added", function(snapshot, prevChildKey) {
var status = snapshot.val();
$scope.statuses.push(status);
});

})

statuses.html

<ion-item ng-repeat="status in statuses" href="#/tab/statuses/{{status.$id}}" class="customItemSize mlSmallerFont item-icon-left item-icon-right">
            <i class="icon ion-ios-person-outline"></i>
            {{ status.update }}
</ion-item>

Upvotes: 0

Views: 367

Answers (1)

Frank van Puffelen
Frank van Puffelen

Reputation: 599131

You seem to be borrowing some ideas from AngularFire, but don't have the code to implement them. As it currently is the {{status.$id}} in your HTML has no value.

To fix that you should either use AngularFire or populate a $id in your controller:

ref.on("child_added", function(snapshot, prevChildKey) {
    var status = snapshot.val();
    status['$id'] = snapshot.key();
    $scope.statuses.push(status);
});

Note that this will only work when snapshot.val() is an object (so not when it's a primitive). But since that is the case in your snippet, this should work.

Upvotes: 1

Related Questions