2016-06-19 3 views
1

Начал изучать ember. Попытка отображения списка альбомов в application.hbs. После возвращения значений массива в Маршрутах я не получаю объект массива в {{#each}}. Пожалуйста, дайте мне знать, что я делаю неправильно.Возвращение массива альбомов в Ember Route Но {{#each}} не работает

Маршруты

import Ember from 'ember'; 
import albums from 'bumbox/models/album-fixtures'; 

export default Ember.Route.extend({ 
    model: function() { 
    return albums; 
    } 
}); 

альбом-fixtures.js

export default [{ 
    id: "1", 
    artwork: "images/the-morning-after.jpg", 
    name: "The Morning After", 
    artist: "GOLDHOUSE", 
    isExplicit: false, 
    songs: [ "11", "12", "13", "14" ] 
}, { 
    id: "2", 
    artwork: "images/dusk-to-dawn.jpg", 
    name: "Dusk to Dawn", 
    artist: "Emancipator", 
    isExplicit: false, 
    songs: [ "21", "22", "23", "24" ] 
}, { 
    id: "3", 
    artwork: "images/the-heist.jpg", 
    name: "The Heist", 
    artist: "Macklemore & Ryan Lewis", 
    isExplicit: true, 
    songs: [ "31", "32", "33", "34" ] 
}, { 
    id: "4", 
    artwork: "images/some-nights.jpg", 
    name: "Some Nights", 
    artist: "fun.", 
    isExplicit: true, 
    songs: [ "41", "42", "43", "44" ] 
}]; 

application.hsb

<div class="album-list"> 
{{#each}} 
    <div class="album"> 
    <a class="ember-view" href="/album/1"> 
     <img src="{{artwork}}"> 
    </a> 
    <p class="album-name">{{name}}</p> 
    <p class="album-artist">{{artist}}</p> 
    <p class="song-count">{{songs}}</p> 
    </div> 
{{/each}} 
</div> 

ответ

1

Вы должны использовать {{#each model as |album|}} для итерации массива модели. Шаблон должен выглядеть следующим образом:

{{#each model as |album|}} 
    <div class="album"> 
    <a class="ember-view" href="/album/1"> 
     <img src="{{album.artwork}}"> 
    </a> 
    <p class="album-name">{{album.name}}</p> 
    <p class="album-artist">{{album.artist}}</p> 
    <p class="song-count">{{album.songs}}</p> 
</div> 
{{/each}} 

Twiddle Пример https://ember-twiddle.com/e1257c2778df8eb46168da67b02ab13c?openFiles=templates.application.hbs%2C

+0

Благодаря она работала. –

+0

Спасибо! Помогли много :) –

Смежные вопросы