Don't get it. If I need my result to do something more, not just enter my variable heros for example. I want to call another function on success or pleted but I just can't. Why is that and how it should be done? I have another variable need to be getting the same data returned from the response (copy of it), but I can make the copy only after I get the data.

this.myService.getHeroes()
    .subscribe(
        function(response) {
            response => this.heros = response;
        },
        function(error) {
            console.log("Error happened" + error)
        },
        function() {
            console.log("the subscription is pleted");
        }
    );

Don't get it. If I need my result to do something more, not just enter my variable heros for example. I want to call another function on success or pleted but I just can't. Why is that and how it should be done? I have another variable need to be getting the same data returned from the response (copy of it), but I can make the copy only after I get the data.

this.myService.getHeroes()
    .subscribe(
        function(response) {
            response => this.heros = response;
        },
        function(error) {
            console.log("Error happened" + error)
        },
        function() {
            console.log("the subscription is pleted");
        }
    );

• javascript
• angular
• typescript
• observable
• angular2-services

Share Improve this question Follow edited Feb 24, 2017 at 23:03 kind user 42k88 gold badges6868 silver badges7878 bronze badges asked Feb 24, 2017 at 21:19 AngularOneAngularOne 2,88066 gold badges3535 silver badges4646 bronze badges 3

• To begin with your syntax is wrong, that will not transpile. You want (response) => this.heros = response; and not a bination of function and the arrow function. – Igor Commented Feb 24, 2017 at 21:21
• 10x I currect it but still the same issue. like I can not call any other function from inside the success/error/plete functions – AngularOne Commented Feb 24, 2017 at 21:25
• First you have to define a function then call it/: – Roman C Commented Feb 24, 2017 at 22:01

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 4

You can call the function just after you get the response.

this.myService.getHeroes()
   .subscribe(res => {
      this.heros = res;
      //insert whatever you want here, e.g. function which needs to wait for asynchro response
    },
    error => { 
      console.log("Error happened" + error)
    }
 );

To expand upon what such a Kind user provided:

The reason you are unable to access your other ponent variables is because the this keyword's scope is encapsulated to within the function only and no longer knows about ponent variables.

In order to reference ponent variables, you must utilize lambda expressions instead:

@Component({
  selector: 'app-browse',
  templateUrl: './browse.ponent.html',
  styleUrls: ['./browse.ponent.css']
})
export class BrowseComponent implements OnInit {

  constructor(private myService: MyService) { }

  myString: string = 'dogs';

  doStuff() {
    this.myService.doMoreStuff().subscribe(returnValue => {
      console.log(this.myString); // 'dogs'
      this.myOtherFunction(); // 'other stuff'
    });

    this.myService.doMoreStuff().subscribe(function(returnValue) {
      console.log(this.myString); // undefined
      // myString does not exist with the scope of this function
      var myString = 'cats';
      console.log(this.myString); // 'cats'
    });
  }

  myOtherFunction() { console.log('otherStuff'); }

}