Comment rester dans ce contexte lors d'un appel ajax (jquery + coffescript)

J'ai fait une classe:

class @GameMap options : { 'width' : 100, 'height' : 100, 'tileWidth' : 45, 'tileHeight' : 20, 'scale' : 5, 'moveDistance' : 100, #Distance to move with the map controlers 'showErrorMessages' : true, 'zindexDecorElementBase' : 99999, 'zindexGroudElementBase' : 88888 } lang : { 'errContainerMissing' : "L'élement pour créer la carte n'existe pas" } constructor: (@element) -> this.run() run: -> this.loadDatas() loadDatas: (top,left) -> $.ajax( url: "/map/getnewcoord", data: { map_width : this.options.width, map_height : this.options.height, tile_height : this.options.tileHeight, tile_width : this.options.tileWidth, window_large : $('.map-windows').width(), window_height: $('.map-windows').height(), top : top , left : left }, success: (data) -> $.each(data,(index,item) -> this.createTile(item.posX,item.posY); ) ) createTile: (m,n) -> #We are in the tile reference yDelta = Math.round((options.width ) * options.tileHeight ); console.log('pass') $ -> gamemap = new GameMap("#map .block-map")

Mais j'ai eu l'erreur

This.createTile n'est pas une fonction

C'est parce que le «ceci» n'est pas le «ceci» de ma classe, mais l'un des retours d'article par mon appel json.

Comment puis-je faire pour garder le «ceci» de ma classe dans la fonction de rappel Ajax?

Voici le mode de CoffeeScript pour le faire:

  success: (data) => $.each(data,(index,item) => this.createTile(item.posX,item.posY); )

Cela compile quelque chose de très similaire à la réponse d'alex, mais je pense, beaucoup plus lisible. L'opérateur => définit une fonction lors de l'utilisation de this qui était présent lorsqu'il a été défini, plutôt que lorsqu'il a été appelé.

Bien que nous soyons là, vous pourriez le trouver plus lisible pour utiliser @ au lieu de this :

  @createTile(item.posX,item.posY);

Gardez une référence à this .

Beaucoup de gens utilisent un modèle tel que var that = this (ou self si il se lit mieux pour vous).

Ensuite, dans votre fonction interne, remplacez les références à this par that , ce qui sera la fonction parentale.

Alternativement, vous pouvez envelopper les définitions de fonctions anonymes avec $.proxy() …

 fn = $.proxy(fn, this);

… ce qui garantira que this intérieur est toujours le parent. $.proxy() est un moyen de $.proxy() croix pour obtenir bind() (qui n'est pas implémenté dans les anciens IE ou Safari).

Vous pouvez passer le context comme param pour la méthode ajax() :

 $.ajax({ /*...,*/ context: this/*, ...*/ });

http://api.jquery.com/jQuery.ajax/