I'm trying to create two views in an ionic app. But when I go from view 1 to view 2 with URL parameter I only get an empty object back from Firebase so my second view doesn't show anything. Totally lost here.
Routing:
.state('app.trials', {
url: "/trials",
views: {
'menuContent' :{
templateUrl: "templates/trials.html",
controller: 'TrialsCtrl'
}
}
})
.state('app.trial', {
url: "/trials/:trialId",
views: {
'menuContent' :{
templateUrl: "templates/trial.html",
controller: 'TrialCtrl'
}
}
})
View 1: /trials - shows all the trials, this is working.
<ion-list>
<ion-item ng-repeat="(trialId, trial) in trials | orderBy:'title'" href="#/app/trials/{{trialId}}">
{{trial.title}} | {{trialId}}
</ion-item>
</ion-list>
Factory for view 1:
.factory('Trial', function ($firebase, FIREBASE_URL) {
var ref = new Firebase(FIREBASE_URL);
var trials = $firebase(ref.child('trials')).$asArray();
var Trial = {
all: trials,
get: function (trialId) {
return $firebase(ref.child('trials').child(trialId)).$asObject();
}
};
return Trial;
})
Controller for view 1 (TrialsCtrl):
.controller('TrialsCtrl', function ($scope, Trial) {
$scope.trials = Trial.all;
console.log($scope.trials);
})
View 2: /trial - should show the trial that has been selected in /trials.
<ion-content class="has-header">
<h1>{{trial.title}}</h1>
</ion-content>
Controller for view 2 (TrialCtrl):
.controller('TrialCtrl', function($scope, $stateParams, Trial) {
$scope.trial = Trial.get($stateParams.trialId);
console.log($scope.trial);
})
Result from console in view 2:
{$$conf: Object, $id: "3", $priority: null, $save: function, $loaded: function…}$$conf: Objectbinding: fdestroyFn: function d(a){n.isDestroyed=!0,i.off("value",k),h=null,m(a||"destroyed")}inst: clisteners: Array[0]promise: Object__proto__: Object$id: "3"$priority: null$value: null__proto__: Object
So this object does not contain all the items in the trial object as requested by $stateParams.trialId...
How to get the full object and show the selected trial info in view 2?
Found the problem:
In view 2 /trials i was referring to {{trialId}} where I should have referred to {{trial.$id}}.
Changing this solved it.