Вложенные объекты в emberjs

Question

У меня есть небольшой набор ember, который загружает продукты и отображает их. Таким образом, каждый продукт имеет магазин знает, что я хочу ссылку со страницы продукта в магазин, но я понятия не имею, где я должен сказать уголек, что продукты имеют магазины

window.App = Ember.Application.create() 

App.Router.map -> 
    @route 'products' 
    @route 'product', path: '/product/:product_id' 
    @route 'store', path: '/store/:store_id' 

App.ProductsRoute = Ember.Route.extend 

    setupController: (controller)-> 
    $.get('api', (response) -> 
     products = response.response.products //this object holds the store 
     .filter((p)-> p.gender == 'male') 
     .map ((p)-> App.Product.create(p)) 

     controller.set('content', products) 
    ) 
    controller.set 'name', 'Produkte' 


App.Product = Ember.Object.extend 
    style: (-> 
    "background-image:url('" + @get("image") + "')" 
).property("url") 

шаблон

script(type="text/x-handlebars", data-template-name="product") 
    <h1>{{page_title}}</h1> 
    <img {{bindAttr src="image"}}> 
    {{#linkTo "store" store}}Store{{/linkTo}} 

продуктов JSON

[ 
    { 
    id: 1 
    name: 'product1', 
    gender: 'male' 
    store: {id: 1, name: 'store1'} 
    } 
] 

Answer 1

Ok это кажется один из уголек WTF моментов. Переменная store кажется своего рода зарезервированным словом. Когда я установил ключ к _store он работает, как ожидалось:

window.App = Ember.Application.create() 

App.Router.map -> 
    @route 'products' 
    @route 'product', path: '/product/:product_id' 
    @route 'store', path: '/store/:store_id' 

App.ProductsRoute = Ember.Route.extend 

    setupController: (controller)-> 
    $.get('api', (response) -> 
     products = response.response.products 
     .filter((p)-> p.gender == 'male') 
     .map ((p)-> 
      p._store = p.store 
      App.Product.create(p)) 

     controller.set('content', products) 
    ) 
    controller.set 'name', 'Produkte' 

App.ProductRoute = Ember.Route.extend 
    setupController: (controller, model)-> 
    console.log(model); 

App.Product = Ember.Object.extend 
    style: (-> 
    "background-image:url('" + @get("image") + "')" 
).property("url") 

Answer 2

Похоже, что у вас есть должны работать

Я сделал простой JSBIN, который имитирует свой API и имеет рабочую store link

App = Ember.Application.create(); 
App.Router.map(function() { 
    this.route("store", {path: 'store/:store_id'}); 
}); 

App.IndexRoute = Ember.Route.extend({ 
    model: function(){ 
     return [{ id: 1, name: 'product1', gender: 'male', store: {id: 1, name: 'store1'}}]; 
    } 
}); 

<script type="text/x-handlebars">{{outlet}}</script> 
<script type="text/x-handlebars" id="index"> 
    <h2>All Products:</h2> 
    <ul> 
    {{#each}} 
     <li>{{name}} - {{#linkTo "store" store}}Store{{/linkTo}}</li> 
    {{/each}} 
    </ul> 
</script> 
<script type="text/x-handlebars" id="store"> 
    <h1>Store: {{name}}</h1> 
</script>