Ember.js (2.5) glut Routing Problem mit belongsTo Beziehung

Question

In meiner ember app, ich bin mit einer Liste der Bücher

BOOKS 
    Book        Author    
    Gorgeous Metal Fish Cookbook  Jefferey Gibson 

Ich versuche Autors, die Informationen (in einem modalen Fenster) auf Klick zum Anzeigen auf den Namen des Autors in meine Bücher Vorlage, ich habe eine Aktion ‚showAuthor‘, in der die Bücher Route festgelegt, aber ich undefinierte Daten bekommen ...

<span {{action 'showAuthor' book}}>{{book.author.name}}</span> 


    **TEMPLATES** 
    <!-- app/templates/books.hbs --> 
    <h1>Books</h1> 
    <table class="table table-bordered table-striped"> 
     <thead> 
     . . . 
     </thead> 
     <tbody> 
     {{#each model as |book|}} 
      <tr> 
      <td> 
       . . . 
      </td> 
      <td> 
       <span {{action 'showAuthor' book}}>{{book.author.name}}</span> 
      </td> 
      </tr> 
     {{/each}} 
     </tbody> 
    </table> 


    ============ 
    **MODELS** 
    // app/models/book.js 
    export default Model.extend({ 
     . . . 
      author:  belongsTo('author', {inverse: 'books', async: true}), 
     . . . 
    }); 

    // app/models/author.js 
    export default Model.extend({ 
     . . . 
     books: hasMany('book', {inverse: 'author', async: true}), 
     . . . 
    }); 

    ========= 
    **ROUTES** 
    app/routes/books.js  
    import Ember from 'ember'; 
    export default Ember.Route.extend({ 
     model() { 
     return this.store.findAll('book'); 
     }, 
     actions: { 
     .. . 
     showBookAuthor(book){ 
      alert('SHOW BOOK AUTHOR : ' + book.author.name); 
     }, 
     . . . 
     } 
    }); 


    app/routes/authors.js  
    import Ember from 'ember'; 
    export default Ember.Route.extend({ 
     model() { 
     return this.store.findAll('author'); 
     }, 
     actions: { 
     .. . 
     } 
    }); 

UPDATE 1 die Aktion in mybooks Vorlage richtig codiert :

{{}} book.author.name

und die Aktion, in den Büchern Route korrekt geschrieben:

showBookAuthor(book){ 
     alert('SHOW BOOK AUTHOR : ' + book.author.nale); 
    }, 

UPDATE 2

wie in der Führung“angegeben, während der Arbeit mit Beziehungen ist es wichtig, dass sie verspricht Rückkehr zu erinnern ...

ich meine Aktion aktualisiert:

showBookAuthor(book){ 
    book.get('author').then((author) => { 
    // now we can work with the author 
    console.log('SHOW BOOK AUTHOR : ' + author.name); 
    }); 
}, 

die Konsole nicht angezeigt den Autor, Name, aber

SHOW BOOK AUTHOR : [object Object] 

, was falsch ist mit meiner Codierung? Danke für die Rückmeldung

Answer 1

In der Vorlage übergeben Sie book.author zu showBookAuthor Aktion, aber in der showBookAuthor definiert in der Route erwarten Sie ein Buch. Sie sollten die Aktion ändern:

showBookAuthor(author){ 
    alert('SHOW BOOK AUTHOR : ' + author.name); 
} 

Answer 2

GELÖST:

ich meine Aktion schreiben sollte, wie folgend:

showBookAuthor(book){ 
    book.get('author').then((author) => { 
    // now we can work with the author 
    console.log('SHOW BOOK AUTHOR : ' + author.get('name')); 
    }); 
},