Wie werden Daten von Route zu Komponente gesendet?

Question

Ich bin Anfänger zu ember.

Ich möchte Daten von Route zu Komponente senden.

ich habe dieses modell in der route jetzt definiert ich möchte dieses modell in der komponente js file verwenden. Ich habe nur Protokoll log, aber es gibt undefined. meine Komponente js-Code ist unter

import Ember from 'ember'; 
export default Ember.Component.extend({ 
    didInsertElement() { 
     console.log(model); 
    } 
}); 

So kann jemand empfehlen, was die tatsächliche Art und Weise ist es, Daten von Route in der Komponente zu verwenden.

Answer 1

Sie nur die Daten zurück, Sie müssen es Vorlage passieren,

import Ember from 'ember'; 
export default Ember.Route.extend({ 
    model() { 
     //here return model data which requires to display template 
     return true; 
    } 
}); 

Innen Vorlage, die Sie zugreifen können model verwendet, in diesem Fall, dass Sie nur wahr geschickt, damit Ihr model Willen true enthält.

Sie müssen dieses Modell an die Komponente übergeben, damit Sie von der Komponente darauf zugreifen können. Innen template.hbs,

{{my-component model=model }} 

Sie können in Komponentenmodell Eigenschaft zugreifen,

import Ember from 'ember'; 
export default Ember.Component.extend({ 
    didInsertElement() { 
     console.log('Model ',this.get('model')); 
    } 
}); 

Willkommen bei Ember. Ich ermutige Sie dringend zu lesen ember guides und spielen mit ember-twiddle

Answer 2

Sie müssen die Daten an die Komponente aus Vorlage übergeben; das heißt, aus der Vorlage der Route müssen Sie das, was Sie wollen (d. h. Modell), an das entsprechende Modell übergeben. Eine einfache Demonstration finden Sie unter twiddle.

In diesem Beispiel; index Route gibt ein JSON-Objekt (ein Objekt mit dem Namen & Nachnamenfelder) aus dem model -Haken zurück. Was von diesem Modell-Hook zurückgegeben wird, wird an my-component innerhalb index.hbs Vorlagendatei als object Eigenschaft übergeben. Dann können Sie einfach auf die entsprechenden Daten in den Komponenten js und hbs zugreifen. Im Beispiel; Daten werden innerhalb der Vorlagendatei my-component.hbs angezeigt. Hoffe es ist klar.