2017-07-21 10 views
2

私はRailsアプリケーションでAlgoliaのインスタント検索を実装しました。私は検索結果として商品のリストを表示するためにそれを使用します。RAILS Algolia Rubyオブジェクトを取得する方法、Instantsearch.js

インスタント検索の実装では、私はAlgoliaのガイドに従った。

私はAlgoliaアカウントのProductsというインデックスを作成しました。それは、名前、URL、イメージ、およびid(+ Algoliaによって与えられたobjectID)を持ちます。

Algoli検索ウィジェットと私application.jsファイル:

var search = instantsearch({ 
    // Replace with your own values 
    appId: "1JJ5DY0CLA", 
    apiKey: 'e24882443747d61c496efc4e17288a36', // search only API key, no ADMIN key 
    indexName: 'Idea', 
    urlSync: true 
}); 


search.addWidget(
    instantsearch.widgets.searchBox({ 
    container: '#search-input', 
    placeholder: 'Search for growth ideas', 
    poweredBy: true 
    }) 
); 

search.addWidget(
    instantsearch.widgets.hits({ 
    container: '#hits', 
    hitsPerPage: 10, 
    templates: { 
     item: getTemplate('hit'), 
     empty: getTemplate('no-results') 
    } 
    }) 
); 

search.start(); 

function getTemplate(templateName) { 
    return document.querySelector('#' + templateName + '- 
template').innerHTML; 
} 

コード私index.html.erbビュー内は次のようになります。ここでは

# Comment: this is the code to structure each result sent by the API 
<script type="text/html" id="hit-template"> 
    <div class="product"> 
     <div class="product-title"> 
      <h3>{{title}}</h3> 
     </div> 
     <div class="product-link"> 
      <%= link_to "Voir", CGI::unescape(product_path(" 
      {{objectID}}")) %> 
     </div> 
    </div> 

が送られた結果であり、 Algolia(ブラウザから取得)では、ビュー/コントローラ内で結果変数を取得する方法がわかりません。

"hits": [ 
    { 
     "id": 1881, 
     "name": "FOULARD NOA PRINT OFF WHITE/TERRA/GERANIUM", 
     "female": true, 
     "category": "Accessoires", 
     "brand_id": 7, 
     "url": "https://www.ekyog.com/foulard-noa-print-off-white/terra/geranium.html", 
     "photos": [ 
     "https://www.ekyog.com/Imagestorage/imagesSynchro/556/790/e86cffa2bbbeea83a9d4bb7de0bbd5c368a6c9dd_B-FOU-288-P219.jpg", 
     "https://www.ekyog.com/Imagestorage/imagesSynchro/556/790/4644f21ce6e8ddf8a1b3af053264c2c5429567d5_B-FOU-288-P219-CONF1.jpg" 
     ], 
     "price_cat": "0€ - 50€", 
     "subcategory": "Echarpes & Foulards", 
     "price_cents": 3400, 
     .... 

私はそのようなリンクを取得することができます:私は私の見解でRubyオブジェクトを取得するにはどうすればよい

<%= link_to "Voir", CGI::unescape(product_path("{{objectID}}")) %> 

を?

私はそれをやろう:

<% product = Product.find("{{objectID}}") %> 

または

<% product = Product.find("{{id}}") %> 

しかし、それは働いていません。どのようにしてオブジェクトをビュー/コントローラ内に取得できますか?

答えて

2

ERBコードはページレンダリング時にのみ評価されます。 link_toは、後でフロントエンドによって更新される文字列(例:​​)を生成しているだけなので、うまくいきます。

Rubyコードを使用してこれらの変数を実際に使用することはできません。実際には、instantsearch.jsを使用すると、ページをリロードすることなく結果を動的に取得できます。つまり、JavaScriptコンテキストにのみアクセスできます。

+0

答えていただきありがとうございますので、私はREACTを使用して行う必要がありますか? –

+0

あなたのヒットテンプレートは、すでにHoganというテンプレートエンジンを使用しています:https://mustache.github.io/mustache.5.html。 – Jerska

関連する問題