current community

your communities

more stack exchange communities

company blog
Stack Exchange Inbox Reputation and Badges
tour help
Stack Overflow is a community of 4.7 million programmers, just like you, helping each other.

Join them; it only takes a minute:

Sign up
Join the Stack Overflow community to:
  1. Ask programming questions
  2. Answer and help your peers
  3. Get recognized for your expertise
up vote 0 down vote favorite

The combo in the topic is giving me a hard time, I'm sure it's a simple mistake somewhere.

Controller:

  class JobCtrl {

      job: Object;  

      public $inject = ['$log', '$resource', 'ApiDataEndpoint', '$stateParams'];  
      constructor(public $log, public $resource, public ApiDataEndpoint, public $stateParams ) {      
           var JobRes = $resource(ApiDataEndpoint.url+'job/:id', {});

           var jobCall = JobRes.get({ id: $stateParams.id},function(){
               this.job = jobCall;
           })
      }  
  }

The route is defined like this:

.state('app.job', {
        url: '/jobs/:id',
        views: {
            'menuContent': {
                templateUrl: 'templates/job.html',
                controller: 'JobCtrl',
                controllerAs: 'vm'
            }
        }
    })

in my view I got this:

<p>
 Name: {{vm.job.Name}}
</p>

But the view never updates when the callback returns. I'm guessing it's either an async problem or a scope problem. Fetching the resource works perfect, the view just never updates. It's seems as I can't set this job from within the callback. What am I missing here?

share|improve this question
    
Do you see {{vm.job.Name}} in the view? If so, your code isn't valid and there should be an error. Or do you just see Name:? – Goldenowner Jan 7 at 12:49
    
I just see Name: I think the JS is valid I'm just not able to set this.job from the callback... If I change my code to use $scope and remove the "as vm" and then in the callback sets $scope.job everything works, but I want to use the "this" syntax – iCediCe Jan 7 at 13:04
1  
When dealing with resources it should work fine to assign stuff directly, not using the callback: this.job = JobRes.get({id: $stateParams.id}); should be enough – Gustav Jan 7 at 14:01
1  
@iCediCe it is some $resource magic! but basically, it keeps the reference and updates the object when the async call is finnished. You can read about it in the documentation – Gustav Jan 7 at 14:14
1  
@iCediCe I prefer using $http wrapped into a service for the async. If you prefer the $resource style, you should have a look at RestAngular – Deblaton Jean-Philippe Jan 7 at 15:36
up vote 0 down vote

I think you can do something like this (untested): 

var jobCall = JobRes.get({ id: $stateParams.id},function(response){
    job = response.data;
})
share|improve this answer
    
That was my first guess, but are you sure this shouldn't be out of the constructor scope? – Deblaton Jean-Philippe Jan 7 at 13:49
    
and simply do job = response.data; – Deblaton Jean-Philippe Jan 7 at 13:49
    
Yea, job is probably right in this case – sebastianForsberg Jan 7 at 13:53
up vote 0 down vote

this isn't available inside the callback function the way you have it implemented. Change to use lambda and it will be:

From this:

var jobCall = JobRes.get({ id: $stateParams.id},function(){
           this.job = jobCall;
       })

To this:

var jobCall = JobRes.get({ id: $stateParams.id}, (response) => {
           this.job = response.data;
       });
share|improve this answer
    
This does not seem to work. The issue is not to access the response but to asign it to 'this'. The solution from @Gustav in the comments to the original question works.... – iCediCe Jan 7 at 14:19

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.