Below is a snippet of my $stateProvider code:
$stateProvider
.state("home", {
url: "/",
template: "<employee-info-component user='$resolve.user'></employee-info-component>",
resolve: {
user: function(individualFootprintService) {
var usr = individualFootprintService.getCurrentUser();
return usr.then(function(data) {
return data;
});
}
}
This is the getCurrentUser service I am using:
function getCurrentUser() {
return $http
.get("/user")
.then(function(response) {
return response.data;
});
}
Here is how I bind the user in my component:
binding:{
user: '<'
}
We initially set up the controller like this:
function individualFootprintController(user) {
var $ctrl = this;
user.then(function (data) {
$ctrl.user = data;
});
}
However, we encountered an exception
Error: [$injector:unpr] Unknown provider: userProvider <- user <- individualFootprintController
So we modified the controller to this:
function individualFootprintController() {
var $ctrl = this;
console.log($ctrl.user);
}
In this version, user
doesn't reach the controller and remains undefined
. My question now is how do I access the desired object from the controller?