2

Estoy intentando cambiar el valor de una variable que pasa por un $.post que a su vez este esta dentro de una funcion.

export class IndexPage implements OnInit {
    contentPage: number = 0;
    constructor () {}
    ngOnInit () {
        this.loadMainContent ();
    }
    loadMainContent () {
        $.post ( url, data, function ( d ) {
            this.contentPage++;
        });
    }
}

La variable 'contentPage' no suma, sigue teniendo siempre el mismo valor. Como se maneja esto?

4
  • has probado utilizar HttpClient
    – DavElsanto
    Commented el 11 nov. 2019 a las 17:49
  • ¿Ya has depurado con un console.log(this) dentro de tu función callback donde intentas realizar el incremento de la variable? Commented el 11 nov. 2019 a las 19:15
  • Si, en console.log siempre me devuelve 'undefined' y en HttpClient me da error Commented el 11 nov. 2019 a las 23:46
  • estas seguro que la peticion a url se hace bien ? Ya que la funcion solo se ejecuta si la peticion es success. Te recomiendo usar observables en angular dan mas potencia que las peticiones de jquery
    – dani t
    Commented el 13 nov. 2019 a las 14:32

1 respuesta 1

2

El problema es la función anónima que creas y pasas como callback de $.post. Al hacerlo de esa manera, this hace referencia a la función y no al contexto, por lo que contentPage no existe. Compruébalo haciendo console.log(this) dentro de la callback.

Si quieres hacer uso de variables que se encuentran en el contexto te recomiendo hacer uso de las arrow functions (funciones flecha), las cuales por diseño this hace referencia al contexto. El código sería algo así:

export class IndexPage implements OnInit {
    contentPage: number = 0;
    constructor () {}
    ngOnInit () {
        this.loadMainContent ();
    }
    loadMainContent () {
        $.post ( url, data, ( d ) => {
            this.contentPage++;
        });
    }
}

Incluso podrías quitar los brackets para que quede aún mas sencillo:

[...]

    loadMainContent () {
        $.post ( url, data, d => this.contentPage++ );
    }

[...]

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.