So here's the relevant segment from my router:
app.js
.state('app.browse', {
url: "/browse/:question",
controller: 'QCtrl',
resolve: {
question: function($stateParams, qService){
console.log(qService.getQuestion($stateParams.question).q);
return qService.getQuestion($stateParams.question).q;
}
},
views: {
'menuContent': {
templateUrl: "templates/browse.html"
}
}
})
/* QSERVICE HERE */
.factory('qService', function() {
var questions = [ {'q': "text text"} ];
return {
questions: questions,
getQuestion: function(index) {
return questions[index]
}
}
})
controllers.js
.controller('QCtrl', function($scope, question){
$scope.questions = qService.questions;
$scope.question = question;
})
Which finds exactly what I'm looking for as demonstrated by the console log.
However in my browser view, I am unable to grab the question
variable!
browser.html
<ion-view view-title="Browse">
{{question}}
</ion-content>
Which always displays as empty! Why is this happening, and how do I resolve it?
Resolve will not bind question unto your controller.
In your controller do this
.controller('QCtrl', function ($scope, question) {
$scope.question = question;
})
In addition - in your state object, the question is being passed incorrectly. Correction:
.state('app.browse', {
url: "/browse/:question",
resolve: {
question: function($stateParams, qService){
return qService.getQuestion($stateParams.question);
}
},
views: {
'menuContent': {
templateUrl: "templates/browse.html",
controller: 'QCtrl',
}
}
})
You're also missing templateUrl in your state object. Update this to reflect where the the template is and it should be good to go :)