Dans Ember, quelle est la différence entre this et this.controller

Question

Je tente de construire une application Ember simple qui recueille des informations à partir d'un formulaire. J'utilise this tutorial comme guide. Dans le tutoriel, il a le code suivant pour récupérer des informations à partir d'un formulaire:

export default Ember.Component.extend({ 
    ... 
    actions: { 
    saveRental1() { 
     var params = { 
     owner: this.get('owner'), 
     city: this.get('city'), 
     type: this.get('type'), 
     image: this.get('image'), 
     bedrooms: this.get('bedrooms'), 
     }; 
     ... 
     this.sendAction('saveRental2', params); 
    } 
    } 
}); 

ici est un peu du code de formulaire correspondant:

 <div class="form-group"> 
     <label for="image">Image URL</label> 
     {{input value=image id="image"}} 
     </div> 

     <button {{action 'saveRental1'}}>Save</button> 
    </form> 

Dans ma solution, je ne pouvais pas obtenir ce travail. this.get ('quel que soit') apparaissait toujours comme 'indéfini' dans mon code. Après un peu de débogage j'ai été capable de trouver une solution, mais cela signifiait changer mon code de this.get('city') à this.controller.get('city')

Quelqu'un peut-il expliquer ce que je fais mal ou pourquoi? Est-ce 'standard' d'utiliser ce controleur?

Answer 1

Le modèle sera le contrôleur. Route model données de retour crochet seront définies dans la propriété contrôleur model par le biais setupController par défaut. Vous pouvez accéder au contrôleur sur la route thorugh this.controller.

Si vous utilisez this l'intérieur du composant, il fera référence à l'instance composant, dans votre cas, si vous avez la propriété city dans le composant, vous pouvez y accéder à l'aide this.get('city') dans le composant.

Answer 2

Il n'a pas mis à jour le didacticiel. Idéalement, vous pouvez accéder en tant que this.get('city') ou this.get('owner') uniquement si vous transmettez les valeurs au composant. Quelque chose comme ci-dessous.

{{new-rental city=city owner=owner}} 

À moins que vous passez les valeurs au composant que vous ne pouvez pas accéder comme this.get('city') au lieu que vous pouvez accéder en this.controller.get('city') qui est ce qui se passe dans votre cas. Essayez de transmettre les valeurs au composant si vous souhaitez y accéder directement.