如何在路由之间传递选定的值?

时间:2017-01-29 15:04:12

标签: javascript ember.js firebase ember-data

我对EmberJS很新。

这是我的模特: book.js

import DS from 'ember-data';

export default DS.Model.extend({
    title: DS.attr('string'),
    author: DS.attr('string'),
    picture: DS.attr('string'),
    buyer: DS.attr('string'),
    bought: DS.attr('boolean', { defaultValue: false }),
    createdAt: DS.attr('date', { defaultValue() { return new Date(); } })
});

我有以下路线: 的 Books.js

import Ember from 'ember';

export default Ember.Route.extend({
    model: function(){
        return this.store.findAll('book');
    }   
});

和相应的 books.hbs

中的一点点
{{#each model as |book|}}
        <div class="book-container col-xs-12 col-sm-6 col-md-4">
            <div class="card">
                <div class="wrapper">
                    <div class="details col-md-12">
                        <h3 class="product-title">Title {{book.title}}</h3>
                        <p class="product-description">Author:{{book.author}}</p>
                        {{#link-to 'books.give' }} Buy {{/link-to}}
                    </div>
                </div>
            </div>
        </div>
{{/each}}

此代码返回我当前存储在应用中的所有图书。

我们的想法是从 books.hbs 中选择Book对象,并将其显示在 give.hbs 中。

我想使用这一行

{{#link-to 'books.give' }} Buy {{/link-to}}

将单个图书从 books.hbs 传递到 give.hbs ,但我不知道如何做到这一点以及它是否可行。

gift.hbs 中,我通过再次循环所有书籍,部分发明了一种非常低效的方法,如果标题匹配则显示它......

  {{#each model as |book|}}
    {{#if (eq book.title "Harry Potter")}}
      <h2><b>{{book.title}}</b></h2>
    {{/if}}
  {{/each}}

显然,“哈利波特”字符串是硬编码的,但它本来可以从 books.hbs 传递出来,因为我的数据相对较小,所以可以解决这个问题。

1 个答案:

答案 0 :(得分:1)

这取决于您希望如何表示网址 如果它是books/give/bookId =&gt;然后去dynamic segments
如果books/give?bookId=1 =&gt;然后去query params实施

books.give内部路线使用findRecord获取特定的图书记录并使用它。