Access value of the scope variable inside callback function in Angular2

Question

I'm trying to retrieve data from DB and set it to the scope variable.'this' inside a callback not working as a angular2 scope. I don't know why. I tried timeout, zone. gas things, Promise things. I don't really know what they are, so I can't able to make use of it.

  //in service.ts
  listFriends(callback) {
    result_data = [];

    db.transaction(function(tx) {

        tx.executeSql('SELECT * from mytable', [], function(tx, results) {

            length = results.rows.length;

            for (i = 0; i < length; i++) {

                //console.log(results.rows.item(i));
                result_data.push(results.rows.item(i))
            }
            callback(result_data);

        }, null);

    });

}
//in component.ts
public allmyFriends: any;
public self = this;
public test;
constructor(myFriendService: MyFriendService) {



    this.myFriendService = myFriendService;
    this.myFriendService.listFriends((response) => {
        //trying to set value to the scope variable.but not working
        this.test="test working";
        //same as above
        this.allmyFriends = response;
        //getting the response from the service successfully
        console.log("in list" + this.allmyFriends);

    } );
  }

Community · Accepted Answer · 2017-05-23 12:02:24Z

5

When you said that you tried zone. What do you mean exactly? Do you inject NgZone and execute code within it.

This question could give you some hints: View is not updated on change in Angular2.

From where do you get your map instance. If it's instantiated outside a zone, Angular2 won't be able to detect updates of the mapLatitudeInput attribute.

You could try something like that:

export class MapComponent {
  constructor(ngZone:NgZone) {
    this.ngZone = ngZone;
  }

  someMethod() {
    this.myFriendService.listFriends((response) => {
      this.ngZone.run(() => {
        this.test="test working";
        this.allmyFriends = response;
        console.log("in list" + this.allmyFriends);
      });
    });
  }

This question could be also related to your problem: Angular2 child property change not firing update on bound property.

Hope it helps you, Thierry

edited May 23, 2017 at 12:02

CommunityBot

11 silver badge

answered Jan 18, 2016 at 8:35

Thierry Templier

203k44 gold badges407 silver badges365 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Nishanthd Over a year ago

OMG! NgZone. run () working like a charm. thank you so much @thierry. I have used this. _ngZone.runOutsideAngular () one, that's why it didn't work. do you know about it?

Thierry Templier Over a year ago

Cool! Pleased to hear that ;-) The runOutsideAngular method is made to execute some processing outside Angular2, outside a zone that triggers the Angular2 change detection. So the behavior seems normal...

umutesen Over a year ago

how can one test the code inside run function? i.e. make sure private variable is set?

Collectives™ on Stack Overflow

Access value of the scope variable inside callback function in Angular2

1 Answer 1

3 Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Linked

Related