Hey, so it is really helpful if the code example provided is working and has proper indentation. I modified your plunker to include the proper scripts, modules and references to the templates in order to get the plunker to work. After doing this I changed your factory to have two functions: one to get all of the cinemas and one to get a cinema by the aId value in your object:
.factory('Cinemas', ['$firebaseArray', function($firebaseArray){
var cinemasRef = new Firebase('https://contagem.firebaseio.com/cinemas');
var cinemas = $firebaseArray(cinemasRef);
return {
all: function () {
return cinemas;
},
get: function (aId) {
for (var i = 0; i < cinemas.length; i++) {
console.log(cinemas[i]);
if (cinemas[i].aId === aId) {
return cinemas[i];
}
}
return null;
}
}
}])
Then, using the master detail pattern that Andrew mentioned, I am passing the id from one state to another via $stateParams
and adding it to the resolve function of the state:
.state('app.cinemas', {
url: "/cinemas",
views: {
'menuContent': {
templateUrl: "cinemas.html",
controller: 'CinemasController'
}
},
resolve: {
allCinemas: function (Cinemas) {
return Cinemas.all();
}
}
})
.state('app.cinemasdetalhe', {
url: "/cinemas/:aId",
views: {
'menuContent': {
templateUrl: "detailPage.html",
controller: 'DetailsController'
}
},
resolve: {
cinema: function($stateParams, Cinemas) {
return Cinemas.get($stateParams.aId);
}
}
});
I separated the states to their own controllers and then get the data from the resolve in them:
.controller('CinemasController', function($scope, $state, allCinemas) {
$scope.cinemas = allCinemas;
})
.controller('DetailsController', function($scope, $state, $stateParams, cinema) {
$scope.item = cinema;
})
Notice I am assigning cinema
to item
because that is what you are using in the details page. Then, I am able to reference that item (without looping through all of them) on the details page.
Here is the updated Plunker: http://plnkr.co/edit/W4XIzE6FIheN0Kd7uyDH?p=preview